Figma plugin

Turn Figma Variables into production code

Token Export reads your collections, modes and aliases and emits ready-to-ship CSS, SCSS, LESS, SCSS mixins or a Tailwind v4 theme — without leaving the canvas.

CSS custom propertiesSCSSLESSSCSS mixinsTailwind v4

Why Token Export

Design tokens, straight to code

Everything you need to keep your design system and your codebase in sync — one export at a time.

Reads native Figma Variables

Collections, modes and aliases are resolved exactly as you authored them — no naming gymnastics or plugin-specific metadata.

Five output formats

CSS custom properties, SCSS, LESS, SCSS mixins and Tailwind v4 @theme — pick the one your codebase already speaks.

Modes become themes

Light / dark and brand modes map straight to CSS selectors or Tailwind variants, so theming just works downstream.

Instant, in-canvas export

No round-trips to a web app. Open the plugin, choose a format, copy or download — the export runs right where you design.

Reusable presets

Save your group separators, casing and format options as presets and re-run the exact same export on every handoff.

Deterministic output

Stable ordering and naming means clean diffs in code review — tokens change only when your design changes.

Ship your tokens in the next five minutes

Install Token Export from the Figma Community, open it on any file with Variables, and export. The free tier lets you try every format.