Core design token and theming engine for TokiForge. Framework-agnostic runtime theme switching, CSS variables, token parsing, validation, and export. Supports React, Vue, Angular, Svelte, and more.
npm install @tokiforge/coreFramework-agnostic design token and theming engine. Runtime theme switching, CSS variables, token parsing, validation, and export. Supports React, Vue, Angular, Svelte, Next.js, Remix, and more.
Core design token engine for TokiForge v2.0.0.
``bash`
npm install @tokiforge/core@^2.0.0
`typescript
import { TokenParser } from "@tokiforge/core";
const tokens = TokenParser.parse("./tokens.json");
`
`typescript
import { TokenParser, TokenExporter } from "@tokiforge/core";
const tokens = TokenParser.parse("./tokens.json");
// Export as CSS
const css = TokenExporter.exportCSS(tokens, { prefix: "hf" });
// Export as TypeScript
const ts = TokenExporter.exportTS(tokens);
`
`typescript
import { ThemeRuntime } from "@tokiforge/core";
const runtime = new ThemeRuntime({
themes: [
{ name: "light", tokens: lightTokens },
{ name: "dark", tokens: darkTokens },
],
defaultTheme: "light",
});
runtime.init();
runtime.applyTheme("dark");
``
- Performance Optimization - Multi-tier caching, lazy loading, and compression
- Accessibility - High contrast mode, reduced motion, color blind support, font scaling
- Advanced Token Features - Functions, expressions, references with fallbacks, scoping, theming API
- Integrations - Storybook, enhanced Figma sync, design tools, CMS, design system tools
- SSR Support - FOUC prevention, cookie persistence, hydration-safe theme switching
- Production Ready - <3KB bundle, <1ms theme switching, comprehensive test coverage
- Token Versioning - Track versions, deprecations, and migrations
- Component Theming - Scoped themes for individual components
- Plugin System - Extensible with custom exporters and validators
- Accessibility - WCAG compliance checking and contrast analysis
- Responsive Tokens - Breakpoint and state-aware token variations
- Figma Sync - Compare and sync tokens with Figma
- CI/CD Integration - Automated validation for pipelines
- Analytics - Token usage tracking and bundle impact
- Token Registry - Multi-team design system support
- IDE Support - Autocomplete and hover previews
See the main TokiForge README and API Documentation for complete documentation.