Whiteboard graphic with text "Color Theory Crash Course"

Le cours intensif ultime sur la théorie des couleurs

Millennial Pink, Classic Blue, Ultimate Grey, Viva Magenta — quel est le problème avec la couleur ?

Les designers visuels et les artistes travaillent depuis des années pour maîtriser cette discipline artistique dans un seul but : attirer votre regard.

Continuez à lire pour savoir comment les concepteurs utilisent la théorie des couleurs pour donner vie à leurs conceptions et comment vous pouvez rejoindre leurs rangs en créant vos propres conceptions Web époustouflantes.

Table des matières

Qu’est-ce que la théorie des couleurs ?

Commençons par les bases ! Qu’est-ce que la théorie des couleurs ?

La brève explication est que la théorie des couleurs est l’étude de la couleur.

La longue explication est que la théorie des couleurs est un ensemble de règles et de directives éclairées par la psychologie des couleurs que les concepteurs – concepteurs visuels, Web et UX – utilisent pour créer des histoires de couleurs harmonieuses avec le pouvoir d’évoquer des émotions, d’influencer les humeurs et d’influencer les comportements.

La théorie des couleurs est une science, contrairement aux mathématiques, que les concepteurs devrait maître. Savoir exploiter la puissance de la théorie des couleurs peut vous aider à concevoir des schémas de couleurs qui ajoutent du sens à vos projets et soutiennent votre message. Mais ne sortez pas tout de suite le brûleur Bunsen de rechange – continuez à lire pour le cours intensif de théorie des couleurs ultime de Skillcrush.

📌 Connexe : Combien de mathématiques dois-je connaître pour coder ?

(Retour au sommet.)

Que signifient les couleurs ?

Ne sois pas si bleu.

J’étais vert de jalousie !

Vous ressemblez à la royauté en violet.

La couleur est un puissant communicateur qui n’a pas besoin de mots pour transmettre des messages. Alors, que disent les couleurs que vous utilisez sur votre design ?

Rouge Colère, Agression, Danger, Énergie, Excitation, Chaleur, Amour, Passion
Bleu Calme, Dépression, Harmonie, Paix, Sécurité, Stabilité
Jaune Lâcheté, Malhonnêteté, Amitié, Bonheur, Joie, Optimisme, Été
Vert Environnement, Fertilité, Santé, Jalousie, Nature, Jeunesse
Orange Équilibre, Énergie, Enthousiasme, Flamboyance, Chaleur
Violet Lumières, Mystère, Noblesse, Royauté, Sagesse, Spiritualité

(Retour au sommet.)

La roue des couleurs

Le dicton dit, n’essayez pas de « réinventer la roue ». En termes de théorie des couleurs, la même roue chromatique est utilisée depuis des siècles. La roue chromatique a été inventée par Sir Isaac Newton au 17ème siècle. La roue chromatique de Newton vit encore aujourd’hui et est la même roue chromatique que nous utiliserons dans ce guide de théorie des couleurs.

Source : 99designs.com

Relations de couleur

Le diagramme de la roue chromatique de Newton a persisté au fil des ans car il illustre efficacement les relations entre les couleurs, établissant une norme uniforme.

La roue chromatique a 12 couleurs et illustre trois relations de couleurs – primaire, secondaire et tertiaire – qui sont à la base de la plupart, sinon de la totalité, des schémas de couleurs.

  • Primaire: Les couleurs primaires sont le rouge, le bleu et le jaune. Vous pouvez créer les couleurs les plus visibles en mélangeant deux couleurs primaires, MAIS vous ne pouvez pas créer une couleur primaire en mélangeant d’autres couleurs — les couleurs primaires sont les OG !
  • Secondaire: Les choses deviennent un peu plus excitantes lorsque vous passez aux couleurs secondaires, car il y a trois autres couleurs ajoutées à la roue chromatique. Les couleurs secondaires sont une combinaison de deux couleurs primaires. Les couleurs secondaires sont le vert, l’orange et le violet.
  • Tertiaire: Pour ne pas être en reste, les couleurs tertiaires complètent nos combinaisons de roues chromatiques avec six nouvelles couleurs. Les couleurs tertiaires sont un mélange d’une couleur primaire et d’une couleur secondaire. Les couleurs tertiaires sont le jaune-vert, le jaune-orange, le rouge-orange, le rouge-violet, le bleu-violet et le bleu-vert ; cependant, si vous ouvrez une boîte de crayons aujourd’hui, vous trouverez des noms amusants comme citron vert, rouille et magenta.

La roue chromatique peut être décomposée encore plus en classant la température de couleur – chaude, froide et neutre.

Les couleurs chaudes comprennent le rouge, l’orange, le jaune et leurs variations. Les couleurs chaudes communiquent de l’énergie, de l’enthousiasme, du bonheur et de la passion, ce qui devrait vous sembler familier si vous passez en revue la signification symbolique de chaque couleur.

Les couleurs froides incluent le vert, le bleu et le violet. Les couleurs froides sont atténuées et dépeignent souvent des sentiments de réserve et de détente.

Les couleurs chaudes et froides ajoutent de la profondeur aux conceptions, mais les concepteurs doivent les mélanger avec prudence car elles se situent aux extrémités opposées du spectre de température de couleur.

💡 Le blanc est-il une couleur ? Vous avez peut-être remarqué que la couleur blanche n’était pas répertoriée dans les couleurs primaires, secondaires et tertiaires. Alors que la plupart reconnaissent le blanc comme une couleur (vous le trouverez dans la plupart des boîtes de crayons, après tout), le blanc est techniquement pas une couleur — et le noir non plus !

(Retour au sommet.)

Propriétés de couleur

Il y a 12 couleurs sur la roue chromatique de Sir Issac Newton, mais les humains peuvent voir environ un million de couleurs différentes, selon Pantone.

Comment est-ce possible? Propriétés de la couleur !

Chaque couleur de la roue chromatique a ses propres teintes, nuances, teintes et tons.

  • Teintes : Une teinte est une couleur pure. Ce sont les couleurs non altérées que vous trouverez sur la roue chromatique – les bleus les plus bleus, les verts les plus verts et les rouges les plus rouges.
  • Nuances : Les nuances sont créées en ajoutant du blanc à une couleur. Par exemple, différentes nuances de violet incluent le lilas et la pervenche.
  • Teintes : Les teintes sont créées en ajoutant du noir à une couleur. Dans ce cas, le violet est une teinte violette.
  • Tons : Les tons sont créés en ajoutant du gris à une couleur. Le mauve est un ton de violet.

En plus de diverses propriétés de couleur, chaque couleur a des niveaux de saturation et de valeur variables qui ont un impact sur l’apparence des couleurs.

La saturation décrit comment une teinte apparaît dans des conditions d’éclairage spécifiques ou l’intensité de la couleur. Les couleurs peu saturées semblent ternes, tandis que les couleurs très saturées sont éclatantes. Il est recommandé de combiner des couleurs de niveaux de saturation similaires pour des conceptions cohérentes ; cependant, les concepteurs expérimentés peuvent mélanger intentionnellement différentes saturations pour créer des conceptions discordantes.

La valeur décrit la luminosité d’une couleur. Une couleur avec une valeur faible (comme le marron) apparaîtra plus foncée et une couleur avec une valeur élevée (comme l’orange) apparaîtra plus claire. En règle générale, les valeurs de couleur n’ont pas de règles définies, mais les conceptions mélangeant des valeurs de couleur opposées ont un contraste élevé, ce qui est idéal pour l’accessibilité Web, ce qui rend les conceptions éclatantes !

C’est toute la théorie des couleurs que nous avons dans ce cours accéléré. Nous allons maintenant vous dire comment appliquer ces connaissances.

(Retour au sommet.)

Schémas de couleurs et création de thèmes dramatiques

Une couleur est le début de chaque jeu de couleurs.

Les schémas de couleurs sont des combinaisons de couleurs qui créent une ambiance spécifique ou transmettent une émotion particulière.

Il existe quatre combinaisons de couleurs courantes :

  • Schémas de couleurs monochromes sont une seule teinte plus sa variété de teintes et de nuances similaires.
  • Schémas de couleurs analogues sont trois teintes (et leurs teintes, nuances et tons) qui sont côte à côte sur la roue chromatique.
  • Schémas de couleurs complémentaires sont deux teintes de couleur opposées sur la roue chromatique. Les couleurs complémentaires ont également un contraste élevé.
  • Schémas de couleurs triadiques sont trois couleurs équidistantes les unes des autres sur la roue chromatique.

Bien sûr, d’autres schémas de couleurs existent, comme les compléments fractionnés, les tétradiques et les carrés, mais vous utiliserez le plus souvent les schémas de couleurs précédents pour créer des histoires de couleurs convaincantes.

(Retour au sommet.)

Générateurs de palette de couleurs

La théorie des couleurs est une connaissance non négociable dans le processus de conception UX ; Cependant, cela ne signifie pas que vous ne pouvez pas utiliser quelques outils de conception Web à votre avantage pour créer des combinaisons de couleurs personnalisées.

Gardez à l’esprit que ces outils ne sont qu’un point de départ. Les couleurs doivent correspondre à l’humeur et à l’émotion de votre projet et dépeindre le sentiment approprié. Ceci peut être réalisé en modifiant les teintes, les nuances et les tons de votre palette de couleurs pour une histoire de couleurs personnalisée parfaite.

(Retour au sommet.)

Toutes les couleurs ne sont pas créées de la même manière : couleurs Web et couleurs d’impression

L’orange sur papier est la même orange sur un écran numérique, n’est-ce pas ? Pas assez.

Les couleurs d’impression sont un mélange de couleurs d’encre appliquées sur du papier qui absorbe la lumière. Les couleurs Web sont une combinaison de pixels colorés qui s’affichent sur des écrans qui émettent de la lumière. Il existe des différences infimes dans chaque support qui pourraient causer de gros problèmes aux concepteurs de sites Web.

Décomposons-le :

Couleurs d’impression sont créés en mode couleur CMJN. Notez que CMJN signifie cyan, magenta, jaune et noir, qui sont dérivés de sources naturelles.

Couleurs Web sont créés dans les modes de couleur RVB (rouge, vert, bleu). Les codes hexadécimaux (également appelés codes hexadécimaux) indiquent à votre ordinateur la quantité de rouge, de vert et de bleu à ajouter à un pixel pour créer la couleur souhaitée.

Chaque mode crée des couleurs reconnaissables, mais intrinsèquement, les couleurs sont différentes en fonction de la façon dont elles sont créées et du support dans lequel elles sont présentées.

La théorie des couleurs est une étude intrigante avec des nuances dont nous n’avons fait qu’effleurer la surface dans ce cours accéléré. Cependant, si vous souhaitez continuer à en apprendre davantage ou à faire la transition vers une carrière de conception technologique créative, envisagez de participer au Camp Skillcrush, notre camp de codage gratuit.

Camp Skillcrush est un camp de codage et de conception gratuit qui enseigne aux campeurs les bases du HTML, du CSS et du JavaScript. fondamentaux de la conception visuelle et Web ; et les principes de l’expérience utilisateur.

Rejoignez Camp Skillcrush et commencez votre formation et votre carrière en conception de sites Web!

(Retour au sommet.)