Tokens
Two-layer token model — RGB channel vars are the source of truth, rgb() aliases are the convenience layer consumers read.
Tokens
--nx-accent-600-rgb--nx-accent-600--nx-mark-strokedata-nx-productdata-themedata-nx-density
Accessibility
- Dark mode (data-theme="dark") overrides only the neutral channel vars on :root — every component recolours with zero per-component dark CSS; accent tints (50/100/700) are derived via color-mix() so any future product dark-themes for free.
Do / Don’t
- Do: Compose alpha with the -rgb channel var (rgb(var(--nx-accent-600-rgb) / .7)) rather than a new hard-coded colour.Don’t: Don't read the -rgb channel var directly as a colour — always go through the rgb() alias or an explicit rgb(var(...) / alpha).