Outil couleur pratique

Générateur de design tokens

Créez des design tokens couleur depuis une palette et exportez CSS variables, SCSS maps, JSON et Tailwind.

Ouvrir dans l’outil principalRetour à l’outil
EnglishItalianoEspañolFrançaisDeutsch

Ce que donne cette page

  • Convertissez HEX bruts en tokens nommés.
  • Utilisez échelles numeriques et noms sémantiques pour rôles UI.
  • Exportez JSON pour relier design et build tools.

Utile pour

  • Design systems
  • Handoff tokens
  • Équipes frontend

Comment l’utiliser

Créez des design tokens couleur depuis une palette et exportez CSS variables, SCSS maps, JSON et Tailwind.

Générateur paletteCréez des design tokens couleur depuis une palette et exportez CSS variables, SCSS maps, JSON et Tailwind.Contrôle WCAGCréez des design tokens couleur depuis une palette et exportez CSS variables, SCSS maps, JSON et Tailwind.Extracteur imageCréez des design tokens couleur depuis une palette et exportez CSS variables, SCSS maps, JSON et Tailwind.
Puis-je utiliser cela avec le generateur principal?

Oui. Commencez ici, ouvrez l’outil Chromaforge avec la même couleur de base et exportez la palette.