Pourquoi nos yeux ont besoin de palettes de couleurs complémentaires… et où vous pouvez les créer

Schémas de palettes de couleurs complémentaires

Saviez-vous qu'il existe en fait une science biologique derrière la complémentarité de deux couleurs ou plus? Je ne suis ni ophtalmologiste ni optométriste, mais je vais essayer de traduire la science ici pour des gens simples comme moi. Commençons par la couleur en général.

Les couleurs sont des fréquences

Une pomme est rouge… non? Eh bien pas vraiment. La fréquence de réflexion et de réfraction de la lumière sur la surface d'une pomme la rend détectable, convertie par nos yeux sous forme de signaux, envoyée à notre cerveau où nous l'identifions comme «rouge». Ugh… ça me fait mal à la tête rien que d'y penser. Mais c'est vrai… Couleur est simplement une fréquence de lumière. Voici une vue du spectre électromagnétique et des fréquences de chaque couleur:

Couleur et spectre électromagnétique

C'est exactement pourquoi la lumière blanche pointée sur un prisme produit un arc-en-ciel. Ce qui se passe réellement, c'est que le cristal change la fréquence de la longueur d'onde lorsque la lumière est réfractée :

Prisme
Le prisme de cristal disperse la lumière blanche en de nombreuses couleurs.

Vos yeux sont des détecteurs de fréquence

Votre œil n'est vraiment qu'un détecteur de fréquence pour la gamme de fréquences de couleur sur le spectre électromagnétique. Votre capacité à détecter les couleurs passe par différents types de cônes dans la paroi de votre œil qui sont ensuite connectés à vos nerfs optiques. Chaque gamme de fréquences est détectée par certains de ces cônes, puis traduite en un signal à votre nerf optique, envoyé à votre cerveau, où il est identifié.

Avez-vous déjà remarqué que vous pouviez regarder longtemps quelque chose de très fort contraste, détourner le regard et continuer à voir une image rémanente qui ne correspond pas aux couleurs d'origine que vous regardiez? Disons que c'est un carré bleu sur un mur blanc:

Après un certain temps, les cellules de votre œil qui traitent la lumière bleue se fatiguent, ce qui affaiblit légèrement le signal qu'elles envoient à votre cerveau. Étant donné que cette partie du spectre visuel est légèrement supprimée, lorsque vous regardez un mur blanc après avoir regardé le carré bleu, vous verrez une image rémanente orange pâle. Ce que vous voyez est le spectre blanc de la lumière du mur, moins un tout petit peu de bleu, que votre cerveau traite en orange.

Théorie des couleurs 101: faire travailler les couleurs complémentaires pour vous

Si cette fatigue ne s'est pas produite, nos yeux et notre cerveau n'ont pas à travailler aussi dur pour interpréter les multiples longueurs d'onde (par exemple, les couleurs) qu'ils voient.

Bruit visuel et harmonie

Faisons une analogie entre le son et la couleur. Si vous écoutiez différentes fréquences et volumes qui n'étaient pas complémentaires les uns des autres, vous penseriez que bruit. Ce n'est pas différent de la couleur, où la luminosité, le contraste et la couleur détectés peuvent être visuellement bruyant ou complémentaire. Dans n'importe quel support visuel, nous voulons travailler vers l'harmonie.

C'est pourquoi vous ne voyez pas un figurant à l'arrière-plan d'un film portant une chemise rouge vif. Et c'est pourquoi les décorateurs d'intérieur travaillent dur pour trouver des couleurs complémentaires sur les murs, les meubles, les œuvres d'art et d'autres caractéristiques de la pièce qu'ils conçoivent. La couleur est essentielle pour créer l'ambiance que ressent le visiteur lorsqu'il y entre en fonction de la facilité avec laquelle son cerveau interprète les couleurs.

Vos palette de couleurs équivaut à assembler un groupe dans une belle harmonie. Et tout comme les voix et les instruments assemblés s'alignent étroitement en volume et en fréquence… il en va de même pour les couleurs complémentaires de votre palette de couleurs. La conception de la palette de couleurs est vraiment une forme d'art pour les professionnels qui ont peaufiné leur détection des couleurs, mais c'est aussi une science informatique, car les fréquences complémentaires peuvent être calculées.

Plus d'informations sur les harmonies bientôt… revenons à la théorie des couleurs.

Couleurs RVB

Les pixels du spectre numérique sont des combinaisons de rouge, de vert et de bleu. Rouge = 0, vert = 0 et bleu = 0 s'affiche comme blanc et rouge = 255, vert = 255 et bleu = 255 est vu comme noir. Tout ce qui se trouve entre les deux est une couleur différente composée des trois. Les bases du calcul d'une couleur complémentaire sont assez simples… il suffit de soustraire les valeurs RVB de 255 pour la nouvelle valeur RVB. Voici un exemple:

La différence de fréquence lumineuse entre l'orange et le bleu est suffisamment éloignée pour qu'elle soit contrastée, mais pas si éloignée qu'elle soit difficile à interpréter pour nos yeux. Les fréquences de couleurs sont complémentaires et agréables à nos récepteurs!

Le calcul d'une couleur est facile… le calcul de 3 couleurs complémentaires ou plus vous oblige à calculer des quantités équivalentes entre chacune des options. Voilà pourquoi générateurs de palette de couleurs venez si pratique! Avec très peu de calculs nécessaires, ces outils peuvent vous fournir plusieurs couleurs qui se complètent.

La roue des couleurs

Comprendre la relation entre les couleurs est mieux visualisé à l'aide d'une roue chromatique. Les couleurs sont disposées en cercle en fonction de leur fréquence relative. La distance radiale est la saturation de la couleur et la position azimutale sur le cercle comme teinte de la couleur.

La roue des couleurs

Fait amusant: Sir Isaac Newton a développé la roue chromatique pour la première fois en 1665, une base pour ses expériences avec les prismes. Ses expériences ont conduit à la théorie que le rouge, le jaune et le bleu étaient les couleurs primaires dont toutes les autres couleurs sont dérivées. Note d'accompagnement… il a même appliqué des «notes» musicales à chaque couleur.

Armez-moi avec Harmony…

cercle de couleur de Newton

Types d'harmonies de couleurs

Les relations entre et comment chaque ensemble de couleurs complémentaires est calculé sont appelées harmonies. Voici une excellente vidéo de présentation :

Différentes caractéristiques sont associées à chaque type:

  • Analogue - groupes de couleurs côte à côte sur la roue chromatique. 
  • Monochromatique - groupes dérivés d'une seule teinte de base et étendus à l'aide de ses nuances, tons et teintes.
  • Triade - des groupes de couleurs régulièrement espacés autour du Couleur roue
  • complémentaire - groupes de couleurs opposées sur la roue chromatique.
  • Complémentaire Split - une variation de complémentaire où qui utilise deux couleurs adjacentes au complément.
  • Rectangle (tétradique) - utilise quatre couleurs disposées en deux paires complémentaires
  • De forme carré ; - similaire au rectangle, mais avec les quatre couleurs espacées uniformément autour du cercle de couleur
  • Composé - la couleur et les deux couleurs adjacentes à sa couleur complémentaire
  • Shades - réglage de la teinte (augmentation de la luminosité) ou de la teinte (obscurité) pour la couleur primaire.

Ce ne sont pas des thèmes subjectifs, ce sont de vrais calculs mathématiques avec de jolis noms appliqués qui nous aident à mieux comprendre les calculs.

Générateurs de schémas de palette de couleurs

En utilisant un générateur de palette de couleurs, vous pouvez obtenir de belles combinaisons de couleurs complémentaires comme celle-ci:

J'utilise souvent des générateurs de palette de couleurs lorsque je travaille sur des sites clients. Comme je ne suis pas un expert des couleurs, ces outils m'aident à mieux sélectionner des éléments tels que les arrière-plans, les bordures, les arrière-plans de pied de page, les couleurs des boutons primaires et secondaires. Le résultat est un site Web beaucoup plus agréable à l'œil ! C'est une stratégie subtile et incroyablement puissante à appliquer à votre conception de n'importe quoi - d'une publicité à un site Web entier.

Voici quelques excellents générateurs de palette de couleurs en ligne:

  • Adobe - un outil fantastique avec jusqu'à 5 couleurs dans lequel vous pouvez tester différents types, effectuer des ajustements et même enregistrer votre thème dans n'importe quel produit Adobe.
  • BrandColors - la plus grande collection de codes couleurs officiels de la marque.
  • canva – téléchargez une photo et ils l'utiliseront comme base pour votre palette !
  • Collectionneur - générez une palette de couleurs Web cohérente en quelques clics. 
  • Concepteur de couleurs - Choisissez simplement une couleur ou utilisez les couleurs présélectionnées et l'application s'occupe du reste. 
  • Chasse aux couleurs - plate-forme gratuite et ouverte pour l'inspiration des couleurs avec des milliers de palettes de couleurs à la mode sélectionnées à la main
  • Colorkuler - générer une palette de couleurs pour Instagram pour le rendre plus esthétique.
  • Colormind - un générateur de jeux de couleurs qui utilise l'apprentissage en profondeur. Il peut apprendre les styles de couleur à partir de photographies, de films et d'art populaire.
  • Espace de couleurs - entrez simplement une à trois couleurs et générez des schémas!
  • Code de couleur - une expérience vraiment cool sur tout l'écran pour créer votre palette de couleurs avec un certain nombre de styles d'harmonie sur la gauche.
  • COULEURS - une communauté créative où des gens du monde entier créent et partagent des couleurs, des palettes et des motifs, discutent des dernières tendances et explorent des articles colorés.
  • Glacières - créez la palette parfaite ou laissez-vous inspirer par des milliers de belles combinaisons de couleurs.
  • Sélecteur de couleurs de données - Utilisez le sélecteur de palette pour créer une série de couleurs visuellement équidistante
  • khroma - utilise l'IA pour apprendre quelles couleurs vous aimez et crée des palettes que vous pouvez découvrir, rechercher et enregistrer.
  • Material design - créez, partagez et appliquez des jeux de couleurs pour votre interface utilisateur. Il est même livré avec une exportation pour votre application!
  • Couleurs Muzli - ajoutez un nom ou un code de couleur et produisez une belle palette.
  • Paletton - choisissez une couleur de base et laissez-vous inspirer.
  • Véranda - laissez-vous inspirer par des tonnes de palettes de couleurs incroyables. 

Couleur et accessibilité

Veuillez garder à l'esprit, lorsque vous décidez de concevoir votre prochain schéma de palettes, qu'un nombre important de personnes ayant des déficiences visuelles et des déficiences de couleur doivent interagir avec vos expériences.

  • Contraste - Chaque couleur indépendante a un luminance. Les couleurs des superpositions et des objets adjacents doivent avoir un rapport de luminance relatif de 4.5: 1 pour que les personnes malvoyantes puissent les distinguer. Je ne me donnerais pas la peine d'essayer de calculer vous-même les ratios, vous pouvez tester vos ratios de deux couleurs avec Colorable, Rapport de contraste, ou Colorsafe.
  • Iconographie - La mise en surbrillance d'un champ en rouge n'aide pas quelqu'un qui a un déficit de couleur. Assurez-vous d'appliquer une sorte de message ou d'icône pour leur faire savoir qu'il y a également un problème.
  • Concentration - De nombreuses personnes naviguent avec des claviers ou des lecteurs d'écran. Assurez-vous que votre interface utilisateur est correctement conçue avec tous les marquages ​​d'accessibilité pour qu'ils puissent profiter de votre site. Pour les personnes malvoyantes, l'utilisation d'espaces blancs et la possibilité d'augmenter ou de réduire la taille des polices sans détruire la mise en page sont essentielles.

Êtes-vous un expert des yeux? Expert couleur? Expert en accessibilité? N'hésitez pas à me fournir des conseils pour améliorer cet article!

Que pensez-vous?

Ce site utilise Akismet pour réduire les spams. Découvrez comment sont traitées les données de vos commentaires..