lib-theme-vermilion

Poster chrome. A bold, identity-forward Crema theme: one hot vermilion red-orange is the brand, and it is carried by the chrome — the primary action, hero panels, the entire sidebar, selection — in big committed slabs, editorial-poster style. Roughly 30–40% of a typical screen is drenched vermilion, while the content well stays warm paper with near-black warm ink, so the color reads as identity, not noise. Massive condensed display type (Anton) is the other half of the voice: the vermilion and the type do the pointing together, and everything else stays quiet ink-on-paper.

Key decisions:

• --primary is the poster vermilion oklch(0.55 0.21 30) — deepened from the nominal 0.60 so near-white ink clears the 4.5:1 floor with margin.
• --sidebar is fully drenched vermilion (near-white foreground, white-alpha hairline borders); the active item is a paper chip punched out of the slab.
• --destructive is deliberately not a sibling of the brand: deeper crimson (oklch(0.48 0.19 15), light label) vs the brighter orange-leaning primary, so a destructive button and a primary button never look related.
• Dark mode is the poster at night: near-black warm charcoal (oklch(0.18 0.01 40)), cards stepping ≥0.05 lighter, and the vermilion glowing slightly brighter (oklch(0.64 0.2 33)) with dark ink on top. The chrome stays vermilion — the sidebar does not go grey at night.
• Radius 0.5rem (poster edges), snappy motion (120/240/360/500ms, springs aliased), low warm-black shadows.

Fonts

Consuming apps load the fonts via a Google Fonts @import at the very top of their entry CSS (never inside theme.css — see the token contract):

@import url("https://fonts.googleapis.com/css2?family=Anton&family=Archivo:wght@400;500;600;700&family=JetBrains+Mono:wght@400;500;600&display=swap");

Notes:

• Anton (headings) ships in a single weight, 400 — it is already black-condensed, so the theme keeps heading font-weight: 400, opens tracking a hair (letter-spacing: 0.01em; condensed faces need air), and does not force uppercase — the face carries the register on its own. Big sizes stay narrow: the ramp tops out at a 4rem hero.
• Archivo (body) at 400/500/600/700 — a grotesque with enough width contrast against Anton to keep reading text calm.
• JetBrains Mono (code) at 400/500/600.

Validation

node create-crema-app/scripts/validate-theme.mjs lib-theme-vermilion/theme.css

Passes the Crema v1 token contract: full Tier-1 token set in both modes, status quartet with ≥4.5:1 label pairs, contrast floors in light and dark, chart hues ≥60° apart, inert glass stubs, springs aliased (never absent).