Harmonie tétradique : quatre couleurs en équilibre

Une harmonie tétradique réunit quatre teintes qui forment deux paires complémentaires sur le cercle chromatique. Reliez-les par des lignes et vous dessinez un rectangle ou un carré, d’où les noms de schémas rectangle et carré. Comme elle contient des couleurs chaudes et froides des deux côtés du cercle, une palette tétradique est la plus fournie des harmonies classiques. C’est aussi celle qui risque le plus de paraître chaotique, sauf si vous laissez une couleur mener et gardez les trois autres à leur place.

Harmonies tétradiques en rectangle et en carré

Les deux versions partent d’une teinte de base et ajoutent son complément, à 180 degrés. Elles diffèrent par l’emplacement de la seconde paire.

Comment construire une harmonie tétradique

1. 1

   Choisissez la teinte de base

   Prenez la couleur dont dépendent votre marque ou votre création. Notez sa teinte en degrés, que donne tout sélecteur de couleur affichant la TSL.

2. 2

   Ajoutez le complément

   Ajoutez 180 degrés. Cette paire est l’ossature du schéma. Les couleurs complémentaires expliquent pourquoi les opposées fonctionnent.

3. 3

   Choisissez rectangle ou carré

   Pour un rectangle, ajoutez 60 degrés à la base et au complément. Pour un carré, ajoutez 90 degrés à chacun.

4. 4

   Donnez un rôle à chaque couleur

   Une dominante, un soutien, deux accents. Notez-le pour que les rôles restent les mêmes dans toutes vos créations.

5. 5

   Réglez luminosité et saturation

   Assombrissez la dominante, adoucissez le soutien et gardez les accents les plus vifs. La teinte fixe l’harmonie ; la luminosité fixe la hiérarchie.

:root {
  --h: 220; /* base hue */

  /* Rectangle scheme */
  --c1: hsl(var(--h) 65% 30%);
  --c2: hsl(calc(var(--h) + 60) 45% 55%);
  --c3: hsl(calc(var(--h) + 180) 85% 60%);
  --c4: hsl(calc(var(--h) + 240) 40% 55%);

  /* For a square scheme use +90, +180 and +270 instead */
}

Pourquoi quatre couleurs sont difficiles à équilibrer

Avec deux couleurs, le contraste est simple. Avec quatre teintes fortes, l’œil ne sait pas où regarder d’abord, et chaque couleur semble crier plus fort que les autres. La plupart des créations tétradiques qui échouent donnent aux quatre couleurs une surface et une saturation à peu près égales. La solution est la hiérarchie, pas moins de couleurs.

Cette deuxième image montre la vraie force du schéma. Quatre couleurs offrent assez de variété pour toute une série : chaque publication peut être menée par un membre différent de la palette tandis que l’ensemble reste clairement uni. C’est idéal pour les carrousels, les menus et les programmes d’événements, où la cohérence de marque compte mais où la monotonie lasse.

Où l’harmonie tétradique fonctionne le mieux

Quatre teintes méritent leur place quand un projet doit distinguer clairement plusieurs choses sans inventer de nouvelles couleurs à chaque fois. Une affiche seule en a rarement besoin. Un système, souvent.

• Codage par catégorie : un menu de café avec boissons, petit-déjeuner, déjeuner et gâteaux, chacun avec sa couleur.
• Programmes d’événements : quatre scènes, parcours ou jours que les visiteurs doivent distinguer d’un coup d’œil.
• Graphiques et tableaux de bord : quatre séries de données qui doivent rester distinctes, idéalement vérifiées pour le daltonisme aussi.
• Marques pour enfants et jeux : là où la version pleine et vive de la palette est justement le but.
• Campagnes saisonnières : une teinte mène chaque trimestre de l’année, les autres en soutien.

Pour les proportions, partez de la règle des 60 30 10 et partagez les dix derniers pour cent entre les deux accents. Sur un menu, par exemple, la couleur dominante remplit la page, la couleur de soutien marque les titres, et les deux accents repèrent les plats végétariens et les nouveautés.

Donner de la sophistication à une palette tétradique

Les palettes tétradiques à pleine saturation ressemblent à une boîte à jouets, parfait pour un magasin de jouets et faux pour la plupart des autres. Tirez deux ou trois couleurs vers le gris ou vers le foncé, et les mêmes teintes paraissent réfléchies et adultes.

Si quatre couleurs paraissent trop nombreuses, reculez à trois avec les couleurs triadiques ou les couleurs complémentaires divisées, qui gardent un fort contraste avec une teinte de moins à gérer. Essayez ensuite la palette sur de vraies créations : dans Gradiently, les couleurs enregistrées dans un kit de marque (une fonction Pro) apparaissent en premier dans chaque sélecteur de couleur du Studio, si bien que chaque publication d’une série peut prendre une dominante différente.