Retour à la leçonMission
Mission : générer une charte de couleurs cohérente sans dupliquer 40 valeurs
Utiliser la relative color syntax et color-mix() en oklch pour dériver des variantes de couleur cohérentes, et expliquer la limite du gamut.
Contexte
Sur theme.css, --primaire: oklch(60% 0.15 250); est la seule couleur de marque définie. L'équipe design veut générer automatiquement, à partir de cette seule variable : une variante :hover plus sombre, une variante :disabled désaturée, et une nuance très claire --primaire-100 utilisable comme fond de badge. Actuellement, un développeur a codé ces trois variantes à la main en hexadécimal, et elles doivent être refaites à chaque changement de --primaire.