Design tokens
Values parsed from @takazudo-modular/design-system's palette.css and tokens.css at build time — never hand-copied. Click any swatch or row to copy it; use the toolbar to pick whether you copy the resolved value or the var(--token) reference, and the header's Design Tokens icon to tweak tokens live.
Click copies:
Palette
Raw grouped swatches (Tier 1) that feed the semantic tokens below.
Gray (neutrals, light → dark)
Brand (accent / price)
State (status colors)
Semantic color
Tier 2 role tokens (--zd-semantic-*) — each resolves through a palette swatch above, so tweaking a palette swatch updates these live too.