Aller au contenu

Roue chromatique en ligne

Choisissez une couleur de base et la roue chromatique calcule des palettes analogues, complémentaires, triadiques et plus encore. Copiez les codes HEX, RGB, HSL ou OKLCH ou exportez-les vers CSS, Tailwind et Figma.

#
Harmonies

Conversion de couleur

Consultez le code de cette couleur dans dix formats distincts, prêts à copier.

Qu'est-ce que la roue chromatique

La roue chromatique (ou cercle chromatique) organise les couleurs selon leur teinte, de 0° à 360°. C'est la base de la théorie des couleurs : elle montre d'un coup d'œil quelles teintes sont proches, lesquelles s'opposent et quels schémas sont équilibrés ou contrastés. On l'utilise en design web, branding, UI, illustration et dans tout projet où la palette doit communiquer clairement.

Contrairement au sélecteur de couleur, pensé pour quand vous avez déjà un code précis, ou au sélecteur de couleur d'image, pensé pour extraire les couleurs d'une photo, la roue chromatique de Matizly part d'une seule couleur de base. Vous fixez la teinte sur la roue ou en Hex, RGB, HSL ou OKLCH ; l'outil calcule le reste selon l'harmonie choisie et vous laisse ajuster, verrouiller, réordonner et exporter la palette.

Couleurs primaires, secondaires et tertiaires

La roue chromatique traditionnelle, celle de la peinture et de l'école, compte douze couleurs construites en trois niveaux.

Primaires

Rouge, jaune et bleu. On ne les obtient pas en mélangeant d'autres couleurs, et toutes les autres en découlent.

  • Jaune
  • Rouge
  • Bleu

Secondaires

Orange, vert et violet. Chacune naît du mélange à parts égales de deux primaires : rouge et jaune donnent l'orange, jaune et bleu le vert, et bleu et rouge le violet.

  • Orange
  • Violet
  • Vert

Tertiaires

Elles mélangent une primaire avec la secondaire voisine : jaune orangé, rouge orangé, rouge violacé, bleu violacé, bleu vert et jaune vert.

  • Jaune orangé
  • Rouge orangé
  • Rouge violacé
  • Bleu violacé
  • Bleu vert
  • Jaune vert

Couleurs chaudes et froides

Si l'on coupe la roue en deux, on obtient deux familles. Les couleurs chaudes (jaunes, oranges et rouges) évoquent le soleil et le feu : elles transmettent énergie et proximité, et semblent se rapprocher de celui qui regarde.

Les couleurs froides (verts, bleus et violets) évoquent l'eau et le ciel : elles transmettent calme et distance, et semblent s'éloigner. En design, on réserve souvent une couleur chaude à ce qui doit attirer l'attention et on utilise les froides pour les fonds et les zones de repos.

Chaudes
Froides

RYB, RGB et CMY : trois roues chromatiques

Il n'existe pas une seule roue chromatique : elle change selon que l'on mélange du pigment, de la lumière ou de l'encre.

RYB, pour la peinture

Rouge, jaune et bleu comme primaires. C'est la roue traditionnelle de l'école et des beaux-arts, utile pour mélanger des peintures.

RGB, pour les écrans

Rouge, vert et bleu de lumière : additionnés, ils donnent le blanc. C'est celle des écrans, des mobiles et du design web, et celle qu'affiche la roue de Matizly.

CMY, pour l'imprimerie

Cyan, magenta et jaune d'encre, plus le noir (CMJN). En se superposant, ils soustraient la lumière. C'est le système de l'impression.

Comment utiliser la roue chromatique de Matizly

Cliquez sur la roue ou saisissez un code Hex, RGB, HSL ou OKLCH pour fixer la couleur de base. Dans le menu, choisissez l'harmonie : analogue, complémentaire, complémentaire divisée, triadique, tétradique, carrée, monochrome, tons, composée ou personnalisée. La palette se met à jour instantanément en colonnes que vous pouvez verrouiller, réordonner, modifier ou agrandir.

Depuis chaque couleur, vous ouvrez les nuances et les réglages fins ; vous pouvez enregistrer la palette dans votre collection, copier les codes ou exporter vers CSS, Tailwind ou Figma. Tout fonctionne dans le navigateur : pas de compte ni de fichiers à envoyer. Si vous partez d'une photo, utilisez d'abord le sélecteur de couleur d'image et apportez ces teintes dans la roue.

Types d'harmonies de la roue chromatique

Analogue

Les couleurs analogues sont voisines sur la roue. Dans Matizly, cinq teintes voisines sont générées à partir de la couleur de base (environ ±20° et ±40°). Le résultat est une palette douce et cohérente, idéale pour les fonds, les sections calmes et les marques qui recherchent une continuité visuelle sans contrastes brusques.

Complémentaire

L'harmonie complémentaire associe une couleur à son opposée sur la roue (180°). Matizly renvoie la paire base + complémentaire. C'est le schéma le plus contrasté : parfait pour les CTA, les accents et pour faire ressortir un élément sans ajouter plus de teintes que nécessaire.

Complémentaire divisée

Au lieu de l'opposée exacte, elle utilise la couleur de base et les deux voisines de sa complémentaire (150° et 210°). Elle conserve le contraste de la complémentaire, avec moins de tension visuelle. Elle convient aux interfaces et au branding qui ont besoin d'accents vifs sans polariser toute la palette.

Triadique

Trois couleurs équidistantes sur la roue (0°, 120° et 240°). Matizly calcule la triade à partir de votre couleur de base. Elle équilibre vibration et harmonie : utile pour des palettes avec du caractère, l'iconographie et les systèmes de couleurs où chaque teinte a un rôle clair.

Tétradique

Aussi appelée rectangulaire : deux paires complémentaires (dans Matizly, des décalages de 60°, 180° et 240°). Elle génère quatre couleurs très variées. Mieux vaut en choisir une dominante et utiliser les autres comme accents pour ne pas surcharger l'interface.

Carrée

Quatre couleurs à intervalles égaux (90°, 180° et 270° depuis la base). Proche de la tétradique, mais plus symétrique. Elle donne des palettes riches et équilibrées pour des tableaux de bord, des illustrations ou des identités avec plusieurs accents de même niveau.

Monochrome

Une seule teinte avec différentes luminosités et saturations, du clair au foncé. Dans la roue de Matizly, elle se comporte comme une échelle de la même teinte. Idéale pour la typographie, les surfaces, les états et les thèmes minimalistes très cohérents.

Tons

Variations d'une même teinte en changeant surtout la saturation (ajouter du gris à la couleur de base). L'échelle de tons est plus douce et sophistiquée que les ombres pures. Elle sert pour des hiérarchies discrètes, des puces, des bordures et des fonds qui ne concurrencent pas le contenu.

Composée

Elle combine des voisines analogues de la couleur de base avec une zone de complémentaire divisée (incluant l'opposée). Matizly génère un schéma de cinq couleurs riche mais maîtrisé : analogues pour la zone principale et complémentaires pour les accents.

Personnalisée

Répartition uniforme de cinq couleurs autour de la roue (tous les 72°). C'est un point de départ libre : vous pouvez ensuite déplacer, verrouiller ou supprimer des couleurs dans la palette jusqu'à obtenir le schéma exact dont votre projet a besoin.

Questions fréquentes

Dans la roue traditionnelle (RYB), ce sont le rouge, le jaune et le bleu. Sur écran (RGB), les primaires sont le rouge, le vert et le bleu, et en imprimerie (CMY) le cyan, le magenta et le jaune.

Les chaudes sont les jaunes, les oranges et les rouges ; les froides, les verts, les bleus et les violets. Les chaudes attirent l'attention et les froides transmettent le calme.

C'est une représentation circulaire des teintes (0°–360°) qui aide à choisir des combinaisons harmonieuses ou contrastées. Dans Matizly, elle sert à générer des palettes prêtes pour le design et le développement à partir d'une seule couleur de base.

Analogue, complémentaire, complémentaire divisée, triadique, tétradique, carrée, monochrome, tons, composée et personnalisée. Chacune place les couleurs sur la roue selon des règles différentes de la théorie des couleurs.

Ce sont celles situées de part et d'autre de la roue (180°). Choisissez votre couleur de base, sélectionnez « Complémentaire » et Matizly calcule la paire automatiquement, avec des codes prêts à copier.

Les analogues sont voisines sur la roue et donnent des combinaisons douces. Les triadiques sont séparées de 120° et créent des palettes plus vibrantes, tout en gardant l'équilibre entre les trois teintes.

Les deux utilisent quatre couleurs. La carrée les répartit tous les 90°. La tétradique (rectangulaire) utilise deux paires complémentaires avec une autre répartition (dans Matizly, 60°/180°/240°), plus asymétrique et avec plus de variété d'accents.

La monochrome fait varier la luminosité (et la saturation) d'une même teinte, du clair au foncé. Celle des tons réduit la saturation en ajoutant du gris, pour un résultat plus sourd et sophistiqué. Les deux gardent une seule teinte.

La roue chromatique explore des harmonies à partir d'une couleur de base. Le sélecteur de couleur sert quand vous connaissez déjà le code exact et voulez le convertir entre Hex, RGB, HSL, OKLCH et d'autres formats.

Oui. Vous pouvez copier chaque couleur, enregistrer la palette dans votre collection et l'exporter dans des formats utiles pour CSS, Tailwind ou Figma, sans inscription.

Plus d'outils