Skip to content

v1.2.0 — Dark mode (4 npm packages lockstep)

Choose a tag to compare

@yutaro-shirai yutaro-shirai released this 11 Jun 01:40
· 84 commits to main since this release

@willink-labs/{tokens, tailwind-preset, css-tokens, react} 1.2.0

Dark mode ships. Auto via prefers-color-scheme; explicit control with <html data-theme="dark"> / "light". Semantic tokens flip, primitives and the numeric brand scale stay invariant — components need zero dark: variants. Design record: ADR-0013.

  • tokenswillink.dark DTCG $extensions on all 16 flipping roles; 5 new surface roles (surface-subtle/muted, track, surface-inverted(-fg)); WCAG contrast audit (scripts/check-contrast.mjs) now a permanent CI gate — dark pairs pass at 5.4–19.3:1.
  • tailwind-preset — full dark flip in both selector paths (media + data-theme), dark shadows, dark-aware bg-gradient-subtle; animate-pulse joins the prefers-reduced-motion safety net (closes the Skeleton flag carried since 0.13.0).
  • css-tokens — new tokens.dark.css export for non-Tailwind consumers.
  • react — 15 primitive-utility leaks across 11 components migrated to the new semantic roles; light-mode rendering is pixel-identical. Skeleton gains motion-reduce:animate-none. Regression guard added to the token-name test gate.

Storybook now has a light / dark / auto toolbar toggle. Roadmap: docs/roadmap/v1.2.md (PRs #43#48).