tokens-to-css reads the token file your design tool exports and writes three things from it: CSS custom properties, a typed TypeScript map and a variables file the design library can import back.

Usage

npx tokens-to-css tokens.json --out src/tokens

:root {
  --color-ground: #0b0c0e;
  --color-accent: #c6ff3d;
  --space-4: 16px;
}
@media (prefers-color-scheme: light) {
  :root { --color-ground: #f6f6f1; }
}

Details

• Aliases are resolved, and kept as var() references where that is useful
• Dark and light modes come from token sets, not from duplicated files
• The TypeScript map makes a typo in a token name a compile error