Exports

One session leaves the tool in every format your stack reads — and each export covers the target’s complete namespace, so nothing falls back to an off-brand default.

The export menu

Quick exports (clipboard)

Per-view CSS, one click, straight to the clipboard:

  • Color — CSS — primitives (--color-brand-500 …) and the derived semantic roles (--background, --foreground, --primary, --ring, surface and status tokens), with a usage guide in the file header: which tokens cover 90 % of cases, and the rules for surfaces vs status.
  • Typography — Tokens CSS — the scale as custom properties, with line heights on the baseline grid; fluid mode exports clamp() expressions.
  • Typography — Styles CSS — ready element styles (headings, body, lead, lists) built from the tokens.
  • Grid — CSS — container and column variables per breakpoint, as media queries.

System files (download)

  • Tailwind v4 — an @theme block: colors, font sizes, spacing, radii, shadows, easing — the full namespaces, including overriding the stock ease-in/out/in-out with your motion profile’s curves.
  • Tailwind v3 — theme.extend as a config file: nested color primitives with literal semantic tokens, border widths, and a DEFAULT merge where an intent name collides with a palette name.
  • shadcn/ui — the complete contract in the current dialect (:root + .dark + @theme inline): brand-tinted --accent, secondary-palette --secondary, chart-1..5 drawn from your palettes’ most saturated steps, and the sidebar family. The legacy HSL format ships as a commented alternative.
  • Figma Variables — collections for color (light/dark modes), typography, and layout with one mode per breakpoint; effect values as float variables plus shadow effect styles.

Every file opens with a generated header naming the tool, the scale parameters, and any deliberately excluded subsets — an export you can audit, not just paste.

The completeness principle

An export that covers half a namespace is a trap: the utilities you forgot inherit framework defaults, and the design drifts exactly where nobody is looking. Scale Composer’s rule is to cover the target’s entire namespace — every radius name Tailwind knows, every shadow size, every easing keyword — or to declare the exclusion in the file header. What your system does not define, it should still decide.

The design tokens guides cover naming, layering, and how tokens travel between tools.