Targets

A target is an output a project produces. Each project declares its targets at creation and can change them later — and that choice is kept separate from the design system itself, so the IR stays pure.

#The target catalog

  • React — code target. Available. The shipped code generator; selected by default.
  • Figma — design target. Available. Exports foundations as Variables + DTCG today.
  • Vue — code target. Coming soon. Defined as a target; generator not yet built.
  • Angular — code target. Coming soon. Defined as a target; generator not yet built.

#Selection is not entitlement

Choosing a target and being allowed to run it are separate concerns. A project can select Figma regardless of plan; the export action is gated separately and re-checked on the server. This keeps the modeling clean and the security boundary honest.

#React is the baseline

React is currently required because it's the only shipped code generator — a project needs at least one way to produce code. As more code targets ship, that rule generalizes to “at least one code target.”

#Targets live outside the IR

A project's targets are stored as project metadata, not inside the synced design-system blob. The IR describes the design system; targets describe what this project does with it. Keeping them apart is what lets the same IR feed any back-end.

Per-target options
Targets can carry their own realization options. A per-target settings model (including platform-specific escapes) is partly built and partly designed — expect it to grow as the second code generator lands.

Once targets are chosen and generation runs, you release the result.