Qu'est-ce que Roue chromatique ?

Choisissez une couleur de base et visualisez les schémas complémentaires, analogues, triadiques, complémentaires scindés, tétradiques et monochromatiques sur une roue interactive. Chaque échantillon affiche son contraste WCAG par rapport au blanc et au noir, et vous pouvez exporter la palette en texte brut ou en PNG partageable.

La roue fonctionne en HSL : vous faites glisser une teinte de base ou tapez un code HEX, et les nuances assorties pivotent en temps réel. Les curseurs de saturation et de luminosité ajustent tout le schéma en même temps. Chaque couleur générée se copie en HEX, RGB, HSL, CMYK ou OKLCH en un clic, et la roue marque chaque point d'harmonie d'un cercle étiqueté pour que vous visualisiez la relation entre les couleurs.

Comment utiliser

1. Cliquez ou glissez sur la roue chromatique pour choisir votre teinte de base, ou saisissez une valeur HEX précise dans le champ de saisie.
2. Choisissez un type d'harmonie (complémentaire, analogue, triadique, complémentaire divisé ou tétradique) pour voir les couleurs correspondantes mises en évidence sur la roue.
3. Copiez n'importe quelle couleur générée en HEX, RGB, HSL, CMYK ou OKLCH en cliquant sur l'échantillon. Exportez la palette complète pour l'utiliser dans vos outils de design.

Quand l'utiliser

• Choisir trois ou quatre couleurs d'accent pour un kit de marque, une fois la couleur primaire fixée.
• Sélectionner une couleur de bouton visuellement opposée au fond pour maximiser le contraste.
• Construire une palette UI où les nuances voisines doivent sembler calmes plutôt que s'opposer.

Résultat

Un web designer choisit #E87040 comme couleur de marque, sélectionne l'harmonie triadique et obtient trois couleurs d'accentuation équilibrées pour sa page d'accueil — en un seul clic.

FAQ

Quelle est la différence entre harmonie analogue et harmonie triadique ?

L'analogue prend des couleurs voisines sur la roue (dans une fourchette d'environ 30 degrés) et donne un rendu calme et unifié. La triadique espace trois couleurs de 120 degrés pour un schéma équilibré, contrasté, qui apporte de l'énergie au design.

Quand choisir la complémentaire plutôt que la complémentaire divisée ?

La complémentaire utilise deux teintes opposées pour un impact maximal mais s'entrechoque si toutes deux sont à pleine saturation. La divisée associe votre base aux deux voisines de l'opposée : même tension visuelle, choc plus doux, plus simple à équilibrer.

Pourquoi les couleurs de l'harmonie changent-elles quand je bouge la luminosité ?

La roue garde les décalages de teinte relatifs mais applique votre saturation et luminosité à chaque résultat. Ainsi, les verts analogues à 40 % de luminosité sont tous des tons de forêt sombre, jamais un mélange de vert foncé et de vert fluo.

Puis-je récupérer la palette en variables CSS ou au format des outils de design ?

Cliquez sur n'importe quelle nuance pour copier HEX, RGB, HSL, CMYK ou OKLCH dans le presse-papiers. De là, ça va directement dans un fichier CSS (--brand-primary: #E87040), dans le champ hex de Figma ou dans la config de couleurs personnalisées de Tailwind.

La tétradique est-elle la même chose qu'une harmonie rectangulaire ?

Oui. La tétradique (aussi appelée rectangulaire) prend quatre couleurs formant un rectangle sur la roue : deux paires complémentaires. La palette est plus riche mais il faut une teinte dominante, sinon le design devient surchargé.

Outils similaires