Skip to main content

​
Supported Frameworks

Tokenami currently works with the following JavaScript frameworks and libraries:
FrameworkSupport Status
React React✅ Supported
Preact Preact✅ Supported
Vue Vue✅ Supported
SolidJS SolidJS✅ Supported
Qwik Qwik✅ Supported

​
Framework-Agnostic Design

Tokenami is designed to work with any framework that supports inline styles via the style attribute. The library generates static CSS and applies styles directly to elements, making it compatible with most modern JavaScript frameworks.

​
Usage Example

Tokenami’s syntax is consistent across all supported frameworks: 
import { css } from '@tokenami/css';

function Button() {
  return (
    <button style={css({ 
      '--padding': 4, 
      '--background': 'var(--color_primary)' 
    })}>
      Click me
    </button>
  );
}

​
Future Support

We’re still in early development and plan to support more frameworks in the future. If you’d like to see support for a specific framework, please:
  1. Check our existing issues to see if it’s already requested
  2. Open a new issue on GitHub to request support
  3. Join our Discord server to discuss with the community

​
Design Systems

Projects that consume a Tokenami design system do not need to be using Tokenami themselves. If they’re not using Tokenami, they can reference their stylesheet after the design system stylesheet and their styles will override accordingly. This makes Tokenami design systems portable and framework-agnostic.

​
Need Help?

If you encounter issues with a specific framework, join our Discord server for assistance.