@solvind/tokens
v0.1.1
Published
Solvind semantic design tokens: light + dark themes, five color palettes, motion and typography scales. Exported as Tailwind v4 plugin, plain CSS variables, and JSON.
Maintainers
Readme
@solvind/tokens
Semantic design tokens for the Solvind universal component library.
- 5 themes (default, deep-ocean, emerald, amber, mono), each with light + dark sets
- WCAG AA verified — the build fails on any contrast violation
- Three export formats: plain CSS variables, Tailwind plugin, JSON (design-tool parity)
- Semantic naming — tokens describe their job (
brand,hairline,text-muted), never their value. Rebrand by swapping values, not rewriting components.
Install
npm install @solvind/tokensUse
Plain CSS (any stack):
<link rel="stylesheet" href="@solvind/tokens/tokens.css" />Tailwind v4:
@import "tailwindcss";
@import "@solvind/tokens/tokens.css";Switch theme: <html data-sv-theme="emerald"> · Switch mode: <html class="dark">
License
MIT — part of the Solvind library.
