PaletteForge
Live preview
One source of truth for your UI

Design tokens to shipped components, in one system.

Hue turns your design tokens into typed, themeable React components — with docs that stay in sync and a theme that re-skins everything from one file.

Typed componentsOne-file themingAuto-generated docs
Themeable by design

Tokens in. Components out.

Components read from your tokens, so a theme swap re-skins the whole app.

Button.tsx
import { Button } from "@hue/ui";

export function Cta() {
  return (
    <Button variant="primary" size="lg">
      Get started
    </Button>
  );
}

// theme.ts — change one token, restyle everywhere
export const theme = { accent: "#d6409f", radius: "10px" };

Tree-shakeable · zero-runtime CSS · ships its own types.

What's inside

Everything a design system needs to stick.

The parts teams usually build twice and maintain forever.

Design tokens

Color, type, space, and shape as a single, versioned source of truth.

Typed components

Accessible React components with first-class TypeScript and variants.

One-file theming

Swap a token map and every component re-skins — light, dark, or per-brand.

Living docs

Docs and prop tables generated from the components, never out of date.

Versioned releases

Semantic versions and codemods so upgrades don't break Friday.

Zero-runtime CSS

Styles extracted at build — fast pages, no flash, no bloat.

Generates for the stack you already use

ReactVueTailwindCSS VariablesFigmaStorybook
120+Teams shipping on Hue
1File to re-theme an app
0msRuntime CSS cost
4.9★Developer rating

Make 'use the design system' easy to say yes to.

Start with your tokens and a single component — grow from there.

Free for open source · MIT-friendly