tokenami/tokenami

Health v2 · maintenance only

Adoption not part of the score

1016 stars · 10 forks observed · 2026-08-28

What it is AI-extracted, prompt v1, taxonomy v1, 2026-08-30, confidence not recorded

Tokenami is a utility-first CSS library for building type-safe design systems using atomic CSS variables, with no runtime injection or bundler requirement. It works across React, Preact, Vue, SolidJS, and Qwik, and is written in TypeScript.

Use cases

• build a type-safe design system in TypeScript
• style components with utility-first CSS without class name soup
• avoid CSS-in-JS runtime injection overhead
• create a portable styling solution that works across React, Vue, and Solid
• theme an app with CSS variables and design tokens
• get autocomplete and type checking for CSS properties in the editor

When to choose

• you want utility-first styling with full TypeScript type safety
• you need a design system that works across multiple frontend frameworks
• you want to avoid runtime CSS injection and bundler-specific plugins
• you prefer CSS variables and tokens over traditional class-based atomic CSS

When to avoid

• you need a battle-tested, stable library for production—Tokenami is in early development
• your team relies on established ecosystems like Tailwind or styled-components
• you need extensive plugin ecosystems or community tooling
• you don't use TypeScript and won't benefit from its core type-safety features

Facets

library · maturity experimental

css-framework ui-components developer-tools web-development frontend web-design cross-platform css-in-js atomic-css design-systems type-safe css-variables utility-first typescript nodejs web-server

Member repositories

For agents

markdown · JSON · MCP: product_card(name="tokenami/tokenami")