Formateur Design Token

Figma JSON -> CSS custom properties

format : -

Collez le JSON exporté depuis Figma Variables et obtenez des propriétés CSS personnalisées pour votre thème. Regroupement par type et préfixe personnalisable.

Entree JSON
Sortie CSS 
Le CSS apparaitra ici
En attente de saisie

Les tokens de design sont les composants fondamentaux d'un système de design. Figma Variables peut exporter ces tokens en JSON standard, mais la conversion en propriétés CSS pour un thème WordPress nécessite une transformation.

Ce formateur :

  • Convertit le JSON Figma en propriétés CSS dans :root { --token: valeur; }
  • Supporte les tokens de couleur (HEX, RGB, RGBA), numériques (px, rem) et chaînes
  • Permet d'ajouter un préfixe personnalisé (--theme-, --brand-)
  • Regroupe les tokens par catégorie (couleurs, espacement, typographie)
  • Génère le bloc :root CSS et les variables SCSS sous forme de map