Codes couleurs et bonnes associations : 17 outils

Faites plaisir en dépensant moins avec les ventes Flash

Bien choisir ses codes couleurs

Les codes couleurs sont indispensables à toute création graphique, quelle soit destinée à un écran, à un site internet ou un blog, ou encore à un support papier. Voici des outils utiles pour trouver les bons codes couleurs dont vous avez besoin, mais aussi pour vous aider à associer les bonnes nuances entre elles.

Les couleurs transmettent des émotions, c’est pourquoi il est important de bien les choisir, mais aussi bien les associer entre elles. Voici leur signification, et des liens vers des sites pour vous aider dans cette démarche.

Selon le support, vous devrez choisir le bon code couleur

  • Le code RVB ou RGB (rouge,vert, bleu) : est un système de codage basé à partir des couleurs primaires. Il est utilisé pour les créations vidéos et écrans.
  • Le code HTML (code HEXA) : est un système de codage informatique des couleurs à partir du RVB. Il est utilisé pour le web. Il offre une palette de 16 777 216 couleurs dans la mesure que les navigateurs, écrans puissent les interpréter. Mais c’est en général le cas.
  • Le code CMJN  (cyan, magenta, jaune, noir) :  ce codage est destiné à l’imprimerie. Il permet de reproduire un large éventail colorimétrique à partir des trois teintes de base, auxquelles sont ajoutées le noir ; on parle également dans ce cas de quadrichromie. Vous l’avez compris, si vous souhaitez créer un document pour l’impression, même sur votre ordinateur, il est conseillé d’utiliser ce codage.
À noter : je suis rémunérée un petit pourcentage sur vos achats lorsque vous passez par un de mes liens de recommandation de produits Amazon sans que cela ne vous coûte rien de plus. Cela me permet de pouvoir continuer à travailler sur ce blog et de vous offrir de nouveaux articles régulièrement.

Résumé pour utiliser le bon code couleur

Le code RVB est utilisé pour créer un document destiné aux écrans ; le code HTML est destiné au web et le code CMJN est destiné à l’impression.

Choisir les bonnes couleurs

Le choix des couleurs peut devenir un véritable casse-tête en matière de création graphique. La difficulté est la même que ce soit pour un site internet ou pour un visuel graphique. Si vous n’êtes pas graphiste, il vaut mieux ne pas se lancer dans des combinaisons hasardeuses.

Sur un site internet, les mauvaises couleurs peuvent faire fuir vos visiteurs. On sait que la couleur est souvent liée à une émotion et qu’elle participe également à l’expérience utilisateur et à l’ergonomie du site. Ainsi, avant d’opter pour telle ou telle teinte, il est important de bien connaître sa cible, ses visiteurs.

Un exemple souvent cité sur le web : pour les occidentaux, le blanc est associé à l’innocence, la pureté, le mariage, la vie etc.  ; alors qu’en Asie, le blanc représente la mort et le deuil.

Source › Color meaning

Faites des cadeaux moins chers grâce aux ventes flash

La signification des couleurs – Les bonnes associations

PRIMAIRES

SYMBOLE SIGNIFICATION POSITIVE SIGNIFICATION NÉGATIVE ASSOCIATION COULEURS
 BLEU Vérité Rêve, sagesse, sérénité, vérité, loyauté, fraîcheur Joie. Ouverture sociale Le bleu foncé avec le blanc ou le beige. Les bleus clairs avec les nuances de marron
JAUNE Joie
Pouvoir
Ego
Fête, joie, chaleur, ego, puissance, connaissance, amitié Traîtrise, mensonge, tromperie Avec les marrons, le blanc, le noir et le crème
 ROUGE Sentiments passionnés Amour, passion, chaleur, sexualité, ardeur, triomphe Colère, interdiction, danger Avec les marrons, le blanc et le noir

SECONDAIRES

SYMBOLE SIGNIFICATION POSITIVE SIGNIFICATION NÉGATIVE ASSOCIATION COULEURS
 VERT Nature
Végétal
Espérance, chance, stabilité, concentration Échec, infortune Toutes. Et plus particulièrement le marron, l’ocre, le crème ou le taupe
 ORANGE Dynamisme Bonne humeur Joie, créativité, communication, sécurité, optimisme Kitch Doit être utilisée à petites doses. Avec le rouge ou le jaune
 VIOLET  Douceur Rêve, délicatesse, paix, amitié, méditation Mélancolie, solitude Difficile à marier : le blanc, le noir et le marron éventuellement. Le rose, le bleu ou le vert sont à bannir en présence de violet

TERTIAIRES

SYMBOLE SIGNIFICATION POSITIVE SIGNIFICATION NÉGATIVE ASSOCIATION COULEURS
 MARRON Terre Rassurante Nature, douceur, neutralité Aucune Le blanc, le jaune, les violets et les roses clairs (vieux rose…)
 DORÉ (OR) Puissance Fortune Richesse, fortune, fécondité  Aucune Toutes les couleurs, et plus particulièrement le noir, le marron et le rouge

AUTRES

COULEURS

SYMBOLE SIGNIFICATION POSITIVE SIGNIFICATION NÉGATIVE ASSOCIATION COULEURS
 NOIR Deuil Élégance Élégance, simplicité, sobriété, rigueur, mystère Mort, deuil, tristesse, vide, obscurité Avec toutes les couleurs. Éviter de l’utiliser seul. Il est recommandé de toujours l’accompagner d’une couleur chaude ou d’une couleur pâle pour rehausser son style
 BLANC  Pureté Pureté, innocence, virginité, mariage Aucune Avec toutes les couleurs
 GRIS Tristesse Calme Calme, douceur Tristesse, solitude, monotonie, mélancolie  Avec toutes les couleurs. Attention de ne pas trop en abuser. En trop grande quantité, elle ramène à un univers fade et triste
 ROSE Dynamisme Tendresse Féminité, romantisme, séduction, bonheur, tendresse, jeunesse Couleur réservée aux filles Réservée avant tout à un univers féminin, le rose est une couleur particulière qui peut parfois tomber dans l’excès et rendre l’effet inverse que celui souhaité

Source › Signification

Des sites pour trouver les bons codes couleurs

Voici quelques sites Internet utiles pour vous aider dans cette démarche. Tous les codes sont indiqué selon la teinte choisie. Vous n’avez plus qu’à recopier le bon code !

  1. Color-ex.comSite internet
  2. Toutes-les-couleurs.comSite Internet
  3. Colorpicker.comSite Internet
  4. Code-couleur.comSite Internet
  5. HtmlcolorcodesSite Internet
  6. Web-color.frSite Internet
  7. 2createawebsite.comSite Internet
  8. Color-sheme GeneratorSite Internet

Des sites pour associer les bonnes couleurs avec des exemples de palettes

  1. Site 1http://www.color-hex.com/color-palettes/popular.php
  2. Site 2http://colorhunter.com
  3. Site 3 https://color.adobe.com
  4. Site 4http://www.colourlovers.com/web/palettes
  5. Site 5 › https://blog.crazyegg.com/2012/07/11/website-color-palettes – Ce site semble ne plus fonctionner
  6. Site 6http://www.onextrapixel.com/2013/10/25/40-stunning-website-designs-with-great-color-schemes
  7. Site 7 › http://paletton.com
  8. Site 8https://encycolorpedia.fr

Sur ces autres sites, vous uploadez une image, votre logo par exemple), et l’outil vous suggère plusieurs palettes de couleurs en se basant sur les couleurs de votre image :

  1. Site 8http://palettegenerator.com
  2. Site 9 › http://www.cssdrive.com/imagepalette

À lire aussi
Sites en ligne pour effets rigolos sur photos
Astuces pour alléger un fichier png
Sites photos libres de droit

Avertissement : ce contenu (textes et images) est protégé par Digiprove et par Copyscape contre le vol et le plagiat. Lire nos mentions légales › Mentions légales

Miss Futée participe au Programme Partenaires d’Amazon EU, un programme d’affiliation conçu pour permettre à des sites de percevoir une rémunération grâce à la création de liens vers Amazon.fr

Isabelle

Je travaille sur Internet depuis 2004 et j'ai vu beaucoup de changements ! Je me suis formée sur plusieurs secteurs : création de sites Wordpress, Référencement (SEO), Marketing Web, Contenu digital etc. Je suis fascinée par toutes les nouvelles technologies et je me tiens au courant des nouveautés. J'aime tester, chercher, comparer. Je vais toujours jusqu'au bout de mes investigations pour obtenir des informations fiables et de qualité, et pour trouver les meilleurs produits. Veuillez noter qu'en tant que Partenaire Amazon, je réalise un bénéfice sur les achats remplissant les conditions requises sans que cela ne vous coûte rien de plus, lorsque vous passez par un de mes liens.

Un commentaire

  1. Coucou Miss futée je te remercie infiniment pour ces outils, j’ai ainsi créé une palette couleur à partir d’une image, c’est génial !

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Bouton retour en haut de la page