Exportations

Une seule session fait sortir l’outil dans tous les formats que votre stack sait lire — et chaque export couvre l’espace de noms complet de la cible, si bien que rien ne retombe sur une valeur par défaut hors marque.

Le menu d'export

Exports rapides (presse-papiers)

Du CSS par vue, en un clic, directement dans le presse-papiers :

  • Couleur — CSS — les primitives (--color-brand-500 …) et les rôles sémantiques dérivés (--background, --foreground, --primary, --ring, tokens de surface et d’état), accompagnés d’un guide d’utilisation dans l’en-tête du fichier : quels tokens couvrent 90 % des cas, et les règles pour les surfaces vs les états.
  • Typographie — Tokens CSS — l’échelle sous forme de propriétés personnalisées, avec les interlignes calés sur la grille de ligne de base ; le mode fluide exporte des expressions clamp().
  • Typographie — Styles CSS — des styles d’éléments prêts à l’emploi (titres, corps, chapô, listes) construits à partir des tokens.
  • Grille — CSS — les variables de conteneur et de colonnes par point de rupture, sous forme de media queries.

Fichiers système (téléchargement)

  • Tailwind v4 — un bloc @theme : couleurs, tailles de police, espacements, rayons, ombres, courbes d’accélération (easing) — les espaces de noms complets, y compris le remplacement des ease-in/out/in-out fournis d’origine par les courbes de votre profil de mouvement.
  • Tailwind v3 — theme.extend sous forme de fichier de configuration : des primitives de couleur imbriquées avec des tokens sémantiques littéraux, des épaisseurs de bordure, et une fusion DEFAULT là où un nom d’intention entre en collision avec un nom de palette.
  • shadcn/ui — le contrat complet dans le dialecte actuel (:root + .dark + @theme inline) : un --accent teinté par la marque, un --secondary issu de la palette secondaire, des chart-1..5 tirés des paliers les plus saturés de vos palettes, et la famille sidebar. Le format HSL hérité est fourni en alternative commentée.
  • Figma Variables — des collections pour la couleur (modes clair/sombre), la typographie et la mise en page avec un mode par point de rupture ; les valeurs d’effet sous forme de variables flottantes, plus des styles d’effet d’ombre.

Chaque fichier s’ouvre sur un en-tête généré qui nomme l’outil, les paramètres de l’échelle et tout sous-ensemble délibérément exclu — un export que vous pouvez auditer, pas seulement coller.

Le principe de complétude

Un export qui ne couvre que la moitié d’un espace de noms est un piège : les utilitaires que vous avez oubliés héritent des valeurs par défaut du framework, et le design dérive précisément là où personne ne regarde. La règle de Scale Composer est de couvrir l’intégralité de l’espace de noms de la cible — chaque nom de rayon que connaît Tailwind, chaque taille d’ombre, chaque mot-clé d’easing — ou de déclarer l’exclusion dans l’en-tête du fichier. Ce que votre système ne définit pas, il devrait tout de même le décider.

Les guides des design tokens traitent du nommage, de la superposition, et de la façon dont les tokens circulent entre les outils.