Explorateur de la roue des couleurs

Faites glisser une épingle autour de la roue des couleurs et regardez les marqueurs d’harmonie tourner avec elle, complémentaire à 180°, triadique par intervalles de 120°, voisins analogues, complémentaire divisée, tétradique. Alternez entre HSL (la roue d’ingénierie) et RYB (la roue de l’artiste), comparez là où elles divergent, et copiez la combinaison que vous retenez comme palette.

Comment fonctionne l'explorateur de la roue des couleurs

  1. 1

    Faites glisser l'épingle autour de la roue

    L'épingle définit votre couleur de base. La saturation et la luminosité se règlent avec des curseurs distincts.

  2. 2

    Sélectionnez une harmonie

    Complémentaire, analogue, triadique, complémentaire divisée, tétradique, monochromatique. Les marqueurs d'harmonie tournent avec la couleur de base.

  3. 3

    Changer de modèle (HSL vs RYB)

    La roue HSL est symétrique (rouge opposé au cyan, vert opposé au magenta). La roue RYB est asymétrique (rouge opposé au vert, bleu opposé à l'orange, correspond à l'intuition du mélange de peinture).

  4. 4

    Copiez la palette

    Hex, RGB, HSL pour la base et chaque marque d'harmonie. Variables CSS, carte Sass ou CSV simple.

Roue HSL vs roue RYB

Les deux roues arrangent les couleurs en cercle, mais elles ne s’accordent pas sur les couleurs qui sont “opposées”:

Base Complément HSL Complément RYB
Rouge Cyan Vert
Orange Sarcelle Bleu
Jaune Bleu Violet
Vert Magenta Rouge
Bleu Jaune Orange
Violet Jaune-vert Jaune
  • HSL (teinte, saturation, luminosité) : une représentation cylindrique du sRGB utilisée en CSS et en création numérique. Ajouter 180° sélectionne la teinte opposée sur cette roue numérique.
  • RYB (rouge, jaune, bleu) : une roue conceptuelle traditionnelle de l’enseignement artistique. Cet explorateur remappe les angles de teinte pour approcher cette convention ; il ne prédit pas le résultat du mélange de pigments réels.

Les deux sont valides pour différents objectifs. Utilisez HSL pour le travail à l’écran; utilisez RYB lorsque vous vous souciez de l’intuition des médias peints.

Définitions d’harmonie sur la roue

  • Complémentaire: base + 180°. Écart de teinte maximal sur la roue choisie.
  • Analogues: base avec des voisines à -30° et +30°. Doux et unifié.
  • Triadique: base + 120° + 240°. Vibrance équilibrée.
  • Complémentaire divisée: base + 150° + 210°. Riche, sans la tension totale de la complémentaire.
  • Tétradique / carré: base + 90° + 180° + 270°. Quatre teintes à espacement égal.
  • Monochromatique: même teinte, différente luminosité/saturation.

Température sur la roue

  • Moitié chaude: rouges, oranges, jaunes. Traditionnellement des couleurs qui avancent (attirent l’œil vers l’avant).
  • Moitié froide: verts, bleus, violets. Traditionnellement des couleurs qui reculent.
  • Neutres: couleurs désaturées; appartiennent à l’une ou l’autre moitié selon la teinte.

Utilisations pratiques

  • Exploration de palette de marque: faites glisser l’épingle jusqu’à ce que vous trouviez une couleur qui convient, puis vérifiez les marques triadiques ou tétradiques pour des accents de soutien.
  • Études artistiques: choisissez une référence photo, trouvez la teinte dominante, regardez les voisins analogues pour un ombrage monochromatique.
  • Illustration: choisissez une paire complémentaire pour les ombres, par exemple, pour un objet orange, peignez les ombres en bleu plutôt qu’en orange plus foncé.
  • Maquette de design d’intérieur: les roues triadiques correspondent aux palettes d’intérieur classiques (bleu/jaune/rouge dans le traditionnel américain; vert/orange/violet dans le bohémien).

Pourquoi la roue n’est pas parfaitement intuitive

La perception humaine réelle des couleurs est plus complexe que ce que chaque roue suggère. Le système Munsell, LAB et OKLCH tentent tous des arrangements perceptuellement uniformes, et ils ne forment pas un simple cercle, le chroma varie avec la luminosité à chaque teinte. Pour la production concrète d’un système de design, les espaces de couleur perceptuels donnent des résultats plus propres que les roues; pour l’exploration conceptuelle des couleurs, la roue reste la plus claire.

Questions fréquentes

HSL pour le design numérique (CSS, écrans, UI). RYB lorsque vous pensez à la peinture, à l’impression ou à l’art traditionnel et que vous voulez l’intuition harmonieuse conventionnelle de l’école d’art.

Les modèles ordonnent les teintes différemment. HSL utilise l’angle de teinte sRGB : le cyan est donc opposé au rouge. Dans la convention RYB traditionnelle, le vert est opposé au rouge. Ici, RYB est une approximation visuelle, pas une prédiction du mélange de peintures précises.

Pour l’éducation, le croquis d’idées et la communication avec les clients, oui. Pour un travail de palette précis, les professionnels utilisent de plus en plus des espaces perceptuels (LAB, OKLCH) où la luminosité et le chroma sont indépendants de la teinte.

Copiez la palette au format CSS, Sass ou CSV, puis enregistrez-la dans votre espace de travail. L’explorateur ne propose ni bibliothèque de palettes ni stockage lié à un compte. Dans le parcours en quatre étapes, les réglages visibles de la roue figurent dans l’URL et peuvent rester dans l’historique du navigateur.

Outils similaires