Six hot hues + two base tones. One hot color leads any single surface — never all six at once.
Each section pairs a calm wall, one hot color, and one direct headline. Reuse a treatment, or set new values on the same pattern.
Per section: set --wall, --on, and --hot on a .facet. The headline uses Instrument Serif; the emphasized word takes --hot.
A display voice, a question voice, and a working voice. Never add a fourth.
Live components lifted straight from the portfolio. Copy, recolor by swapping the surface's hot.
.btn--fill fills paper, then shifts to the surface --hot on hover. .btn--line is the quiet outline. Both are pill-shaped, 44px+ tall.
The fixed top-right control group — kit link + segmented theme toggle — and the sketchbook's capture pill: one press renders the visitor's collage as terminal-green ASCII art and downloads it. The full-page morphing grid (see the portfolio hero) replaces static wall grids in Kit v2.
The flagship project card. At rest the illustration is a white line drawing on the bare canvas; on hover the whole card lifts, a neon --hot glow rings the border, and the illustration recolors from white to pink in step with the title — the same white→pink shift the section header uses.
Micro-label .lab: Archivo 700, tracked 0.16em, uppercase. Chapter marker pairs a roman numeral (in --hot) with a rule and a tracked title.
Outline pills at 62% opacity; on hover they take the surface --hot for border and text.
Smaller hairline pills for taxonomy — quieter than craft chips, used in the work list.
Big Bricolage titles on hairline rows. Hover slides the row right, colors the title --hot, and rotates the arrow node.
Four things I've shipped end to end. Hover to see them.
Oversized Bricolage title with an italic Instrument word in --hot, balanced by a quiet supporting line.
Difference-blend top nav (renders legible on any wall) and a right-rail dot index that expands its label on hover. Shown here on a fixed dark plate.
Italic Instrument serif set on ink, framed by hairline rules, with an acid ✦ between phrases. The strip scrolls continuously (paused under reduced-motion).
A large Bricolage mailto paired with a --hot circle that rotates its arrow on hover.