Skip to content

Start typing to search products, founders and collections.

↑↓ navigate openesc closeFull search →
Northlight logo

Northlight

VerifiedFeatured

Design tokens that stay honest between Figma and production code

Launched Week 32, 202636k viewsFreemium · from $19/mo
981Visit site
Northlight interface — main workspace
  • Northlight interface — detail view
  • Northlight interface — settings

About Northlight

Northlight makes your codebase the source of truth for design tokens and generates the Figma side from it. Colour, type, spacing and motion stay identical across both, and drift becomes a failing CI check instead of a discovery three sprints later.

Features

  • Code is the source of truth

    Tokens live in TypeScript with full type-checking, review and history.

  • Figma variables generated

    Native Figma variables produced through the API — not a plugin panel bolted on.

  • Drift is a CI failure

    A stale consumer fails the build instead of surfacing as a visual bug in QA.

  • Multi-platform output

    CSS, Tailwind, iOS, Android and JSON from one definition.

  • Conditional tokens

    Values that vary by theme, platform or density — expressible because they live in code.

  • Incremental adoption

    Generate alongside your existing library and diff before you cut over.

The story

1 min read

Design systems fail at the seam

The tokens are not the hard part. The hard part is that Figma and code are two independent databases with no referential integrity between them, and they diverge the moment anyone is in a hurry.

Northlight fixes the direction of authority. Code is the source of truth. Figma variables are generated from it. Drift is impossible by construction rather than by discipline.

The pipeline

tokens.ts  →  Northlight build  →  ├─ CSS custom properties
                                    ├─ Tailwind theme
                                    ├─ iOS / Android resources
                                    └─ Figma variables (via API)

One definition, five consumers, one CI check that fails the build if any consumer is stale.

Why not the other direction

Generating code from Figma sounds friendlier to designers and is a trap. Figma has no types, no review process and no history you can bisect. The moment a token needs a conditional — a value that differs by theme, platform or density — the design tool cannot express it and the pipeline breaks.

Code can express all of it, and designers get the result as native Figma variables that behave exactly like hand-made ones.

Adoption path

Northlight does not require you to rebuild your design system. Point it at your existing token file, let it generate a Figma library alongside your current one, and compare. Most teams cut over in a single sprint once they can see the diff.

Pricing

Free for open-source and solo use.

Solo

Free

  • One project
  • All output targets
  • Figma sync
  • Open source use
Popular

Team

$19/month

  • Unlimited projects
  • CI drift checks
  • Multi-brand themes
  • Slack alerts

Enterprise

Custom

  • SSO and SCIM
  • Self-hosted build agent
  • Audit log
  • SLA

Changelog

  1. v3.1

    Density as a token dimension

    Compact and comfortable variants now resolve from one definition rather than two parallel token sets.

Frequently asked questions

Do designers need to change how they work?

No. They consume native Figma variables exactly as they do today. What changes is that the variables are generated, so they can no longer silently diverge from production.

What if design needs a token that engineering has not built?

Designers propose tokens through a pull request template that Northlight generates from a Figma selection. It takes about a minute and produces a reviewable diff.

Does it support multiple brands or themes?

Yes. Themes are a first-class dimension, and a token can resolve differently per brand, per colour scheme and per platform from a single definition.

Is it free for open source?

Yes, permanently, including private forks of your own OSS project. Paid plans start at $19/month for commercial teams.

Northlight alternatives

Similar products worth comparing before you commit.

Works with

Discussion64

Markdown supported. Be useful, not promotional.

Related products

Ranked by shared categories, tags and explicit alternative relationships.