Kiln theme preview

Live L3 pack proof: docs shell chrome, a card, a form, one marketing band, and the package token specimen. Overrides come from frontend/brands/kiln/tokens.css; see frontend/brands/kiln/PROFILE.md.

Material card

Surface-raised and brand colours should follow the kiln pack tokens.

Nested dark specimens must set data-bw-brand and data-theme on the same element so kiln darks apply, not package default darks.

Kiln light card

Compound light: data-bw-brand kiln and data-theme light on this frame.

Kiln dark card

Compound dark: data-bw-brand kiln and data-theme dark on this frame.

Preview band

One marketing band under the kiln brand.

Continue

Theme tokens (L3)

Light

--bw-color-accent
--bw-color-border
--bw-color-border-strong
--bw-color-danger
--bw-color-fg
--bw-color-fg-on-accent per theme

≥ 4.5:1
--bw-color-success
--bw-color-surface
--bw-color-surface-marketing-tint
--bw-color-surface-overlay
--bw-color-surface-raised
--bw-color-surface-sunken
--bw-color-warning
--bw-elevation-1
--bw-elevation-2
--bw-elevation-3
--bw-font-family-display
--bw-font-family-mono
--bw-font-family-sans
--bw-radius-lg
--bw-radius-md
--bw-radius-sm

Dark

--bw-color-accent
--bw-color-border
--bw-color-border-strong
--bw-color-danger
--bw-color-fg
--bw-color-fg-on-accent per theme

≥ 4.5:1
--bw-color-success
--bw-color-surface
--bw-color-surface-marketing-tint
--bw-color-surface-overlay
--bw-color-surface-raised
--bw-color-surface-sunken
--bw-color-warning
--bw-elevation-1
--bw-elevation-2
--bw-elevation-3
--bw-font-family-display
--bw-font-family-mono
--bw-font-family-sans
--bw-radius-lg
--bw-radius-md
--bw-radius-sm