Construire un design system avec Tailwind CSS et Radix UI

Un design system n'est pas juste une collection de composants : c'est un langage commun entre design et développement. Voici comment je structure mes tokens de couleur, d'espacement et de typographie.

Des variables CSS aux classes utilitaires

:root {
  --background: 228 40% 97%;
  --primary: 258 89% 62%;
}

.dark {
  --background: 240 52% 4%;
}

En mappant ces variables dans tailwind.config.ts, chaque composant devient théme-aware sans effort : bg-background, text-foreground fonctionnent dans les deux modes.