Native Tailwind v4 · Pure Rust

Tailwind, generated by Rust.

Every element on this page is styled by bext-css, a Rust-native Tailwind generator built on encre-css. No PostCSS, no Bun bundle, no watcher — bext-server scans the SSR'd HTML and inlines <style data-bext-css> into <head>.

Live components

Server-rendered. View source — every styled element below comes from a Tailwind utility class. (loading bytes…)

Sites

25

3 this week

Requests / min

1,284

stable

Edge p99

42 ms

last 5 m

Buttons

healthy

bext color palette (defined in crates/bext-css/src/lib.rs)

bext-accent-2

#10b981

bext-cloud

#8b5cf6

bext-companion

#6366f1

bext-info

#3b82f6

bext-warning

#f59e0b

bext-error

#ef4444

bext-success

#10b981

bext-black

#0a0a0a

Heads-up

bg-bext-info, text-blue-900 — utilities and bext-* tokens compose the same way.

CPU note

Sites without route_css = true skip the scan entirely — zero overhead.

No build step

No PostCSS, no tailwindcss CLI, no tailwind.config.js.

Watch out

Tailwind's preflight resets h1, etc. Style your layout with utilities or scoped class selectors.

Form controls

Domains

  • demo.bext.dev live
  • cloud.bext.dev opt-in
  • docs.bext.dev skipped

Generated CSS for this page

Read out of document.querySelector('style[data-bext-css]') after the page loads. Contains exactly the utilities used above — nothing else.


            (run this page in a browser to see the inlined stylesheet)
          

How it works

1

Opt in via toml

[build.css] route_css = true in bext.config.toml. Cached per-site at startup.

2

Scan SSR HTML

After the page renders, bext-server walks the body and pulls every class="…" token via byte scanning.

3

Inline the stylesheet

encre-css generates the minimal CSS, and we inject <style data-bext-css> right after <head>.

bext.config.toml

# bext.config.toml
[build.css]
route_css = true       # opt this site into per-route Tailwind injection

Page source (this page)

/** @jsxImportSource @bext-stack/framework */
// Just write Tailwind utility classes — the Rust route-css pipeline
// scans the rendered HTML and inlines a <style data-bext-css> block
// into <head>. No build step, no PostCSS, no tailwind.config.js.
export default function Page() {
                return (
                                <div class="rounded-2xl bg-gradient-to-br from-bext-cloud to-bext-companion p-8 text-white shadow-lg">
                                                <h1 class="text-4xl font-bold tracking-tight">Hello, Tailwind</h1>
                                                <p class="mt-2 text-white/80">
                                                                Generated by Rust at SSR time. No Node, no PostCSS.
    </p>
                                                <button class="mt-4 rounded-lg bg-white/10 hover:bg-white/20
                                                                                                                                                                    px-4 py-2 font-medium transition-colors">
                                                                Click me
                                                </button>
                                </div>
                );
}

crates/bext-css/src/lib.rs

// crates/bext-css/src/lib.rs
    pub fn inject_route_css_if_enabled(site_root: &Path, html: String) -> String {
                if route_css_enabled(site_root) {   // cached per-site toml lookup
                                inject_route_css(html)          // scan classes → encre-css → inline
                } else {
                                html                            // zero CPU for non-Tailwind sites
                }
}