@bwui/tailwind

Brickwork Tailwind presets, generated from @bwui/tokens. Expose Brickwork semantic roles as Tailwind utilities (bg-surface, text-fg, border-border, rounded-md, shadow-e1, font-sans, …). Colors resolve through the token layer, so light/dark switching keeps working via the .dark class.

Tailwind v4 (CSS-first)

@import "tailwindcss";
@import "@bwui/tokens/tokens.css"; /* defines --bw-* runtime vars */
@import "@bwui/tailwind/theme.css"; /* maps them to Tailwind namespaces */

Then use utilities directly:

<div class="bg-surface text-fg border border-border rounded-lg shadow-e1 p-4">
  <span class="text-accent font-sans">Brickwork</span>
</div>

Tailwind v3 (JS preset)

// tailwind.config.js
import brickwork from "@bwui/tailwind/preset"

export default {
  presets: [brickwork],
  content: ["./src/**/*.{html,js,ts,jsx,tsx}"],
}

Both artifacts are regenerated by the @bwui/tokens build; do not edit preset.mjs or theme.css by hand.