Import from Figma - two paths (Pro)

Both map your design language onto our bespoke SCSS components - not a pixel-copy. They import colours, fonts, spacing, shadows, breakpoints, grid where detectable. Where values aren’t detectable (unnamed radii, missing grids), defaults are kept.

Link + token

Paste Figma file URL + read-only personal access token. We read styles/frames and prefill: named colour styles (success/warning/error matched), text styles as fonts/sizes/line-height, shadows → elevation, radii → roundness, auto-layout gaps → spacing, column grid, breakpoints from device frames. Components pre-selected when ≥3 matched.

Plugin (no token)

Install free AniStyl Token Exporter → run inside Figma → Copy JSON → paste in builder. No network access, no token. Components aren’t auto-selected - tick them in Components.

After import, fine-tune in live preview before download. It maps your design language onto our components - not a pixel-copy.

Next: Customize → React wiring