Sachin Dilshan

TokiForge - Design token engine for all frameworks

by

🎨 Stop managing design tokens differently for each framework.

TokiForge is a lightweight, framework-agnostic design token engine that works seamlessly across React, Vue, Angular, Svelte, and vanilla JavaScript.

The Problem:

Managing design tokens across multiple frameworks means duplicating code, maintaining separate systems, and losing consistency. Each framework has its own theming solution, making it impossible to share tokens between projects.

The Solution:

TokiForge provides a unified API that works everywhere. Define your tokens once, use them in any framework. Switch themes at runtime without page reloads.

Key Features:

✨ Framework-agnostic - Works with React, Vue, Angular, Svelte, Next.js, Remix, or vanilla JS

🎨 Runtime theme switching - Change themes instantly without rebuilds

📦 Lightweight - Less than 3KB gzipped

🔒 Full TypeScript support - Type-safe tokens with autocomplete

🛠️ CLI tools - Initialize, build, and manage tokens from command line

🌓 Dark mode ready - Built-in light/dark theme support

⚡ CSS custom properties - Native browser support with smart fallbacks

Perfect For:

- Teams building design systems

- Multi-framework projects

- Developers who want consistent theming

- Anyone tired of framework-specific token management

Tech Stack:

- TypeScript

- CSS Custom Properties

- Framework adapters (React hooks, Vue composables, Angular services, Svelte stores)

- CLI tool for token management

Open Source:

MIT licensed, actively maintained, contributions welcome!

Try it out and let us know what you think! 🚀

7 views

Add a comment

Replies

Be the first to comment