Mode d’emploi
Les palettes sont construites sur le cercle chromatique (HSL) :
- Analogue : voisines sur le cercle (±20°, ±40°), calmes et cohérentes.
- Complémentaire : la teinte opposée (180°) pour un fort contraste.
- Triadique : trois teintes espacées de 120°.
- Tétradique : quatre teintes espacées de 90°.
- Monochrome : une teinte à différentes luminosités.
- Nuances 50–900 : teintes claires et foncées pour un système de design complet, façon Tailwind.
Exemple concret
À partir du vert #0f6e56, l’harmonie complémentaire donne un rouge rosé proche de #6e0f27 — idéal pour des boutons qui attirent l’œil.
Questions fréquentes
Comment choisir les couleurs d’un site ?
Partez de la couleur de votre marque, utilisez ses nuances pour les fonds et le texte, et une couleur complémentaire pour les boutons importants.
Comment utiliser les variables CSS ?
Collez-les dans votre feuille de style, puis utilisez par ex. color: var(--color-3).
Les couleurs sont-elles accessibles ?
Vérifiez le contraste du texte avec l’outil HEX vers RGB — il affiche le rapport de contraste WCAG.