@tokiforge/core

Framework-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.

Installation

npm install @tokiforge/core@^2.0.0

Usage

Parse Tokens

import { TokenParser } from "@tokiforge/core";

const tokens = TokenParser.parse("./tokens.json");

Export Tokens

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);

Runtime Theme Management

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");

Features (v2.0.0)

• 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

Previous Features (v1.1.2)

• 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

API

See the main TokiForge README and API Documentation for complete documentation.