LES COULEURS

Coordonner les couleurs, cela ne s’improvise pas. Ce n’est pas

non plus une question de hasard.

Peu de personnes sont capables de décréter, sans réfléchir, que

le jaune fonctionnera très bien avec le violet, sans être sûr de
se tromper.

De nombreuses études ont été effectuées sur le sujet. Elles

s’appuient toutes sur un outil très simple : le cercle
chromatique.

De manière subtile, presque inconsciente, elles peuvent

conduire au rejet ou à l’engouement envers un produit.
Évidemment, tout le monde ne réagit pas de la même manière
aux différentes teintes. Il y a là une question de culture, et
même de goûts personnels.

Pourtant, de nombreux psychologues s’intéressent

régulièrement à l’impact des couleurs. Certains ont émis très
sérieusement l’hypothèse que l’impression laissée par une
couleur peut influencer jusqu’à 60 % de notre jugement.
Nous avons déjà parlé du choix des couleurs simples. Cette
fois, nous allons observer comment les combiner, grâce au
cercle chromatique.

Le premier a été dessiné en 1666 par Isaac Newton. Il a vu de

nombreuses variations depuis, et il existe aujourd’hui sous
divers dégradés, plus ou moins riches.

Son principe reste identique : des couleurs sont organisées

dans une roue, selon un dégradé subtil allant d’une teinte
primaire à l’autre. Pour rappel, les teintes primaires, qui ne
peuvent théoriquement pas être obtenues en mélangeant
plusieurs teintes, sont le rouge, le jaune et le bleu.

Couleurs chaudes ou couleurs froides

On pourrait presque dire que c’est de saison. Le temps est

froid et on rêve de boissons chaudes.
Dans le monde des couleurs, on dit que les couleurs chaudes
(rouge, jaune, orangé…) transmettent l’énergie, la passion,
l’enthousiasme et la joie.

Les couleurs froides (bleu, vert, violet…), elles, donnent

plutôt une impression de calme, voire de professionnalisme.

La roue chromatique peut se diviser entre ces deux pôles. On

peut choisir de ne prendre des couleurs que d’une seule
température, afin d’éviter les chauds et froids malencontreux.
Un graphisme sera pourtant plus riche s’il sait habilement
régler le thermostat des teintes.

Différentes manières de coordonner les couleurs

Utiliser le cercle chromatique à bon escient permet de ne pas

se tromper au moment de choisir des teintes à associer
ensemble. Voici quelques-unes des options possibles.

Les couleurs complémentaires

Les couleurs complémentaires sont celles qui se situent de part

et d’autre de la roue.

Elles créent un contraste important qui permet de mettre en

valeur un élément par rapport à l’autre. Plus la roue sera large
et comptera de secteurs différents, plus la nuance pourra
évidemment être importante.
Les couleurs analogues

Ce sont celles qui se situent de part et d’autre d’une teinte

dominante choisie. Utilisées ensemble, elles instaurent un effet
harmonieux et apaisant.
La triade

L’idée est de tracer un triangle équilatéral pour relier trois

zones de couleur sur la roue. L’une d’entre elles sera utilisée
pour l’arrière-plan quand les autres seront réservées au
contenu et à la mise en valeur de certaines zones.

L’agencement de ces trois couleurs s’avère assez équilibré.

Le rectangle (ou le carré)

Il est possible d’augmenter le nombre de couleurs à utiliser.

Les quadrilatères permettent de jouer entre teintes chaudes et
froides.

Il faut cependant choisir une tonalité dominante parmi les

quatre sélectionnées. Il importe aussi de rester prudent : si
aucune teinte n’est proche des autres sur le cercle
chromatique, l’effet obtenu peut être dérangeant.
Comment faire des dégradés de couleur ?
Le principe du dégradé, c'est que les couleurs doivent
se fondre les unes dans les autres. Il ne doit pas y avoir
de marque de transition de l'une à l'autre. Si vous le
construisez manuellement, il sera nécessaire de
superposer les teintes par endroits, d'ajouter de la
transparence, du flou…

Quelle couleur pour un dégradé ?

Ses couleurs les plus basiques sont le bleu et le rouge,
mais en vérité, c'est bien plus que cela. C'est un
mélange majestueux de couleurs orange, jaune, violet,
rouge et bleu. N'hésitez pas à utiliser
un dégradé lumineux dans vos conceptions graphiques.

5 outils pour trouver de superbes dégradés de

couleur
1. WebGradients

WebGradients.com offre un large choix de dégradés de

couleurs élégants et originaux (avec 180 variantes en stock à
l’heure où nous écrivons ces lignes).

Pour utiliser un “gradient”, plusieurs solutions s’offrent à vous

:

 Télécharger une image PNG ;

  Copier le code CSS (en appuyant sur “Copy CSS”) ;
 Créer vous-même le dégradé en réutilisant les couleurs
indiquées (attention, cela n’est pas le cas pour ceux qui
contiennent plus de 2 couleurs).
2. Eggradients

Eggradients.com est une vraie mine d’or qui propose plus de

200 dégradés (petite originalité : ils sont représentés sous la
forme d’un œuf, d’où le nom du site.)

Ici, vous pouvez soit copier-coller le code CSS du dégradé qui

vous intéresse soit le faire manuellement en utilisant les
couleurs indiquées (mais pas de PNG à télécharger.)
3. Khroma

Khroma est un outil original et très puissant pour obtenir

(entre autres) des dégradés de couleurs.

Son fonctionnement est un peu particulier : il vous faudra dans

un premier temps sélectionner 50 couleurs (cela peut prendre
un peu de temps).

Suite à cela, Khroma analysera vos choix pour vous faire des
propositions personnalisées de gradients, mais aussi de
palettes de couleurs et de typographies.
4. ColorSpace

ColorSpace diffère légèrement des précédents sites, mais

s’avère tout aussi utile.

Il vous permet de créer facilement un gradient personnalisé en

indiquant deux couleurs et une orientation (à l’aide des petites
flèches).

Vous n’avez plus qu’à vous emparer du code CSS, et le tour

est joué.
5. ColorZilla

Un peu plus vétuste que les autres sites présentés

ici, ColorZilla n’en reste pas moins un outil très efficace.

Avec son éditeur similaire à celui de Photoshop – vous ne

serez pas dépaysé si vous êtes un utilisateur du logiciel
d’Adobe – il permet de créer et de personnaliser rapidement
des dégradés de couleurs.