# Design Tokens

Découvrez 5 outils Design Tokens en ligne pour traiter, convertir, valider et gérer vos données depuis votre navigateur.

> Page canonique: https://elysiatools.com/fr/tags/design-tokens

## Présentation

Les outils Design Tokens vous permettent de traiter, convertir, valider et gérer des données Design Tokens depuis une interface dans le navigateur, sans installer de logiciel.

## Questions fréquentes

### Que puis-je faire avec les outils Design Tokens ?

Vous pouvez traiter, convertir, valider et gérer des fichiers et données Design Tokens avec les outils disponibles dans cette catégorie.

### Comment les données sont-elles traitées ?

Vous utilisez les outils dans votre navigateur, tandis que le traitement s'effectue sur les serveurs d'Elysia Tools. Les saisies textuelles ne sont pas conservées et les fichiers envoyés sont automatiquement supprimés après 6 heures.

### Dois-je installer un logiciel pour utiliser ces outils ?

Non. Les outils sont accessibles depuis votre navigateur et ne nécessitent pas l'installation d'un logiciel.

## Outils

- [Extracteur de tokens de thème ECharts](https://elysiatools.com/fr/tools/echarts-theme-token-extractor): Extrait des design tokens — couleurs, nombres, tailles de police et chaînes — d'un JSON de thème ECharts et les exporte directement dans votre design system. Collez un objet thème (celui enregistré et passé à echarts.init(dom, themeName)) et l'outil parcourt chaque feuille, étiquetant chaque couleur (avec normalisation optionnelle nommé/rgb → hex), nombre d'espacement, taille de police et chaîne, puis émet des variables CSS propres, un thème.extend Tailwind, un tokens.json Style Dictionary ou des variables SCSS. Pont entre un thème de visualisation ECharts et les tokens de design Figma/CSS/Tailwind sans recopier chaque valeur à la main.
- [Exportateur de Tokens Figma](https://elysiatools.com/fr/tools/figma-tokens-export): Collez un JSON de variables Figma / Tokens Studio et exportez vers Tailwind, variables CSS shadcn, Style Dictionary ou SCSS. Préserve les tokens de couleur, d'espacement et de police avec inférence de type.
- [De la palette d’image aux design tokens](https://elysiatools.com/fr/tools/image-to-design-tokens): Extrait les couleurs dominantes d’une image par k-means et les exporte en variables CSS / SCSS / config Tailwind / tokens JSON, avec noms et échelle de teintes
- [Classes Tailwind vers CSS](https://elysiatools.com/fr/tools/tailwind-class-to-css-converter): Convertit les classes Tailwind (ex. p-4 flex gap-2 hover:bg-blue-500/20 md:p-6) en CSS équivalent copiable pour des projets sans Tailwind. Couvre spacing, flex, grid, couleurs, typographie, bordures, effets, transformations, transitions et variantes responsive/état.
- [Sync de palette Tailwind](https://elysiatools.com/fr/tools/tailwind-color-palette-sync): Entrez des HEX, choisissez le schéma de noms (échelle 50–950 / nom unique / imbrication) et générez le fragment theme.extend.colors de tailwind.config.ts avec les niveaux WCAG AA/AAA. Dark mode optionnel.

## Contenu associé

- [CSS](https://elysiatools.com/fr/tags/css): Découvrez 48 outils CSS en ligne pour traiter, convertir et valider vos fichiers et données CSS depuis votre navigateur.
- [HTML/CSS](https://elysiatools.com/fr/tags/html): Découvrez 86 outils HTML/CSS pour traiter, convertir et valider des données HTML, CSS et DOM dans votre navigateur.
- [Couleur](https://elysiatools.com/fr/tags/color): Découvrez 214 outils Couleur pour travailler avec les formats HEX, RGB et HSL, ainsi qu’avec les palettes, depuis votre navigateur.
- [Variables CSS](https://elysiatools.com/fr/tags/css-variables): Découvrez 8 outils pour travailler avec les variables CSS dans le navigateur, sans installer de logiciel. Les textes ne sont pas conservés et les fichiers envoyés sont supprimés après 6 heures.
- [Design System](https://elysiatools.com/fr/tags/design-system): Découvrez 7 outils Design System en ligne. Utilisez-les dans votre navigateur avec un traitement sur les serveurs Elysia Tools.
- [Palette de couleurs](https://elysiatools.com/fr/tags/color-palette): Découvrez 10 outils de palettes de couleurs en ligne pour travailler avec vos données de couleurs depuis votre navigateur. Les textes ne sont pas conservés et les fichiers sont supprimés après 6 heures.