Back to Plugins
JSON to Variables

JSON to Variables

Import design tokens from JSON as Figma variables — with Light/Dark modes.

Plugin Preview

JSON to Variables preview

About this plugin

JSON to Variables turns your design-token JSON into native Figma variable collections in one click.✦ Creates proper modes (e.g. Light & Dark as side-by-side columns) — not separate collections ✦ Follows Mantine-style naming for shade scales (Cloud 0–Cloud 10, keeps 950) ✦ Supports #hex, #rrggbbaa and rgba() — with transparency preserved (glass/overlay tokens stay correct, never black) ✦ Keeps your full token hierarchy (semantic/border/default, glass/border, …) ✦ Paste JSON or load a file; existing collections with the same name are safely replacedPerfect for keeping a multi-brand / multi-theme design system in sync with your tokens.

Plugin Details

Version3
CreatedAugust 20, 2026
Last UpdatedAugust 25, 2026
Categorylibraries-other
CreatorI.Golden
Stats1 installs, 1 likes
PricingFree

Technical Details

  • API:1.0.0
  • UI:ui.html
  • main:code.js
  • Document Access:dynamic-page
  • Editor Types:
    figma
  • Allowed Domains:
    • none