Figma UI kit
Resources

Figma kit sync

The Figma library and the token JSON are one source. A variable in Figma and a token in code are the same named thing.

The kit

  • Variables: the colour ladder, status families, radius tiers, spacing and motion.
  • Each component page carries its variant matrix: sizes, states and the touch boundary.
  • The cover's release history row records every version change.

Open the Figma UI kit

Keeping it in sync

A token change is made in Figma variables, exported to the JSON, then compiled. The compiler's check mode fails if any platform snapshot no longer matches.

# after exporting docs/jeevy_full_tokens.json
npm --prefix frontend run tokens:build
npm --prefix frontend run tokens:check

Variable names map one to one: radius/surface in Figma is --radius-surface in CSS and JeevyTokens.Radius.surface in Swift.

Release cadence

Patch releases ship daily when a token or rule changes. A patch never renames a token; a rename is a minor release with a migration note. The scope attribute on migrated screens is not a version and never changes.

More in Resources