Codes Couleurs CSS et HTML : Guide Complet 2026 des 140 couleurs CSS Dénomination, Propriétés, Codes RVB et Hexadécimal
Vous créez votre site web et vous vous demandez comment choisir les bonnes couleurs ? Vous êtes au bon endroit ! Les codes couleurs constituent le fondement de toute identité visuelle réussie sur le web. Que vous soyez entrepreneur, artisan ou commerçant, maîtriser ces codes vous permettra de créer un site professionnel qui inspire confiance à vos visiteurs.
Les couleurs font partie intégrante de votre message sur le Web : elles envoient un message, établissent l’ambiance, elles sont le cœur de votre identité de marque.
Elles sont un élément de langage à part entière : elles aident à souligner un propos, un indiquer un contenus interactif, décorent un bouton, bordent une image.
Elles véhiculent une émotion, un état d’esprit.
Choisir les bonnes couleurs pour votre site n’est pas qu’une question d’esthétique : c’est un enjeu de crédibilité professionnelle. Vos couleurs doivent refléter votre métier et rassurer vos clients potentiels. Dans cet article, vous découvrirez comment utiliser efficacement les 140 couleurs supportées par tous les navigateurs, leurs codes hexadécimaux, RVB, et des conseils pratiques pour les intégrer dans vos feuilles de style CSS.
Quelle palette de couleurs choisir pour votre site web en 2026 ?
En 2026, Cloud Dancer (PANTONE 11-4201) devient la couleur Pantone de l’année 2026 : signe d’un besoin collectif de douceur et d’apaisement visuel ? Ce blanc dense ouvre toutes les possibilités chromatiques.
Avez-vous d’ailleurs remarqué le retour des couleurs pastel ?
CLOUD DANCER : la couleur Pantone de 2026
Ce blanc aux reflets légèrement chauds — ni froid, ni crémeux, ni beige — évoque pour moi la page blanche du matin, le linge frais étendu au soleil, la luminosité d’un ciel entre deux nuages. Pantone la décrit comme un symbole d’apaisement dans une société qui redécouvre la valeur de la réflexion tranquille. Une couleur de l’espace, du souffle, de la clarté retrouvée. Elle dit l’envie de faire silence, de revenir à l’essentiel, de désencombrer le regard comme on désencombre l’esprit. Première teinte véritablement blanche jamais choisie comme Couleur de l’Année depuis le lancement du programme en 1999, Cloud Dancer marque une rupture assumée avec les années de couleurs vibrantes et revendicatrices. On peut la percevoir comme un retrait, mais aussi comme une respiration collective nécessaire — une invitation à la simplification, au retour à l’essentiel, comparable à une toile vierge qui illustre un besoin de pauses mesurées et d’espaces mentaux ouverts.
- Code Pantone : 11-4201 TCX
- Code Hexadécimal de Cloud Dancer : #F0EEE9 *
- Code RVB de Cloud Dancer : 240, 238, 233 *
- Code CMJN de Cloud Dancer : 0%, 1%, 3%, 6%*
* Note importante sur les codes techniques : le système Pantone étant propriétaire, les valeurs RVB et CMJN disponibles publiquement sont des approximations numériques qui peuvent légèrement varier selon les sources (les codes TCX, TPX et les conversions écran diffèrent).
Les pastels sont de retour — et ils s’accordent parfaitement avec Cloud Dancer
Ce n’est pas un hasard si Pantone a choisi un blanc pour 2026. Ce fond lumineux agit comme une toile vierge sur laquelle les pastels peuvent enfin respirer — et ils n’ont jamais été aussi présents dans le monde du design et de la communication visuelle.
Les couleurs pastel ne se contentent plus d’être « jolies » : elles sont désormais légèrement saturées, ce qui leur ajoute de la vitalité tout en conservant leur douceur caractéristique. Cassisdesign On parle de rose pâle légèrement rosé, de vert menthe qui pétille, de bleu ciel dynamique — des teintes qui ont quitté les rayons puériculture pour s’imposer dans le branding des artisans, des thérapeutes, des créateurs et des commerces de proximité. Autrefois cantonnées aux collections printanières ou aux marques pour enfants, ces teintes répondent aujourd’hui au désir croissant des consommateurs pour des designs plus lumineux et plus accessibles. VistaPrint
Pourquoi ce retour maintenant ? Parce que le contexte le demande. Après des années de couleurs affirmées et revendicatrices, les tons pastel sont reconnus pour leur effet calmant, idéaux pour créer des environnements visuels reposants, tout en stimulant l’imagination sans agressivité. Blog du Webdesign Ils accompagnent parfaitement l’aspiration collective à plus de douceur, de simplicité, d’authenticité — exactement ce que Cloud Dancer incarne.
#F0EEE9 Copié !
#B8D4E8 Copié !
#9DB5A0 Copié !
#D5D0CC Copié !
#F0EEE9 Copié !
#F5E6A3 Copié !
#F2C4A0 Copié !
#9F7E69 Copié !
#F0EEE9 Copié !
#6B3F7E Copié !
#C2714F Copié !
#2C2C2C Copié !
#F0EEE9 Copié !
#C9B8E8 Copié !
#A8D5C2 Copié !
#E8C9C1 Copié !
Bon à savoir avant de vous lancer
Quelle que soit la palette choisie, veillez toujours à tester le contraste entre votre couleur de texte et votre fond : Cloud Dancer est très clair, et un texte gris trop pâle posé dessus risque de ne pas respecter les normes d’accessibilité. Sur un fond Cloud Dancer, privilégiez un texte dans les tons sombres — gris anthracite, prune profond ou le brun Mocha Mousse, couleur Pantone 2025 — pour garantir lisibilité et confort de lecture.
Comment intégrer la couleur dans votre communication sans vous tromper ?
Si vous débutez dans le webdesign et que vous ne voulez pas faire de faute de goût, je vous propose une règle simple :
1 couleur dominante
+ 1 couleur secondaire
+ noir (ou couleur très foncée pour les textes)
+ blanc pour le fond (ou couleur très très claire pour conserver un bon contraste qui vous assurera de respecter les normes d’accessibilité).
Saupoudrer votre couleur dominante dans votre site WordPress
- En couleur d’accent pour vos boutons d’appel à l’action
- Dans vos titres pour une hiérarchie visuelle douce mais efficace
- Pour vos témoignages clients afin de renforcer la crédibilité
- En arrière-plan de sections importantes (mais avec parcimonie !)
Intégrez-la dans vos contenus visuels
- Logos et identité visuelle : idéalement, cette couleur doit être présente dans vos éléments de communication
- Publications réseaux sociaux : votre « couleur d’accent » génère naturellement plus d’engagement et constitue votre identité repérable entre toutes 📱
- Supports de communication : cartes de visite, flyers, elle doit parfaitement fonctionner à l’impression.
Comment utiliser les codes couleurs du Web ?
Les trois formats essentiels à retenir :
- Nom anglais : idéal pour débuter (ex: « blue », « red »)
- Code hexadécimal : le plus utilisé en CSS (
#FF0000) - Code RVB : précision maximale (rgb(255, 0, 0))
Vous pouvez rencontrer des codes CMJN : il est adapté aux spécifications techniques des imprimeurs. C’est donc le mode colorimétrique à utiliser pour vos travaux d’impression.
Voici comment les utiliser dans votre feuille de style:
Nom anglais
<style>
div {
background-color: deepskyblue;
color: deepskyblue;
}
</style>
Code hexadécimal
<style>
div {
background-color: #00BFFF;
color: #00BFFF;
}
</style>
Voici les 140 couleurs supportées par tous les navigateurs et leurs codes RVB et Hexadécimal :
Nom Anglais |
Couleur |
Hexadécimal |
Code RVB |
| Black | #000000 | 0 0 0 | |
| Dimgrey (dimgray) | #696969 | 105 105 105 | |
| Grey (gray) | #808080 | 128 128 128 | |
| Darkgrey (darkgray) | #A9A9A9 | 169 169 169 | |
| Silver | #C0C0C0 | 192 192 192 | |
| Lightgrey (lightgray) | #D3D3D3 | 211 211 211 | |
| Gainsboro | #DCDCDC | 220 220 220 | |
| Whitesmoke | #F5F5F5 | 245 245 245 | |
| Ghostwhite | #F8F8FF | 248 248 255 | |
| White | #FFFFFF | 255 255 255 | |
| Ivory | #FFFFF0 | 255 255 240 | |
| Floralwhite | #FFFAF0 | 255 250 240 | |
| Seashell | #FFF5EE | 255 245 238 | |
| Lavenderblush | #FFF0F5 | 255 240 245 | |
| Oldlace | #FDF5E6 | 253 245 230 | |
| Linen | #FAF0E6 | 250 240 230 | |
| Mistyrose | #FFE4E1 | 255 228 225 | |
| Pink | #FFC0CB | 255 192 203 | |
| Lightpink | #FFB6C1 | 255 182 193 | |
| hotpink | #FF69B4 | 255 105 180 | |
| Deeppink | #FF1493 | 255 20 147 | |
| Palevioletred | #DB7093 | 219 112 147 | |
| Fuchsia (magenta) | #FF00FF | 255 0 255 | |
| Mediumvioletred | #C71585 | 199 21 133 | |
| Thistle | #D8BFD8 | 216 191 216 | |
| Plum | #DDA0DD | 221 160 221 | |
| Violet | #EE82EE | 238 130 238 | |
| Orchid | #DA70D6 | 218 112 214 | |
| Mediumorchid | #BA55D3 | 186 85 211 | |
| Darkorchid | #9932CC | 153 50 204 | |
| Darkviolet | #9400D3 | 148 0 211 | |
| Blueviolet | #8A2BE2 | 138 43 226 | |
| Indigo | #4B0082 | 75 0 130 | |
| Mediumslateblue | #7B68EE | 123 104 238 | |
| Slateblue | #6A5ACD | 106 90 205 | |
| Darkslateblue | #483D8B | 72 61 139 | |
| Mediumpurple | #9370DB | 147 112 219 | |
| Darkmagenta | #8B008B | 139 0 139 | |
| Purple | #800080 | 128 0 128 | |
| Rosybrown | #BC8F8F | 188 143 143 | |
| Lightcoral | #F08080 | 240 128 128 | |
| Coral | #FF7F50 | 255 127 80 | |
| Tomato | #FF6347 | 255 99 71 | |
| Orangered | #FF4500 | 255 69 0 | |
| Red | #FF0000 | 255 0 0 | |
| Crimson | #DC143C | 220 20 60 | |
| Lightsalmon | #FFA07A | 255 160 122 | |
| Darksalmon | #E9967A | 233 150 122 | |
| Salmon | #FA8072 | 250 128 114 | |
| Indianred | #CD5C5C | 205 92 92 | |
| Firebrick | #B22222 | 178 34 34 | |
| Brown | #A52A2A | 165 42 42 | |
| Darkred | #8B0000 | 139 0 0 | |
| Maroon | #800000 | 128 0 0 | |
| Beige | #F5F5DC | 245 245 220 | |
| Antiquewhite | #FAEBD7 | 250 235 215 | |
| Papayawhip | #FFEFD5 | 255 239 213 | |
| Blanchedalmond | #FFEBCD | 255 235 205 | |
| Bisque | #ffe4c4 | 255 228 186 | |
| Peachpuff | #FFDAB9 | 255 218 185 | |
| Moccasin | #FFE4B5 | 255 228 181 | |
| Navajowhite | #FFDEAD | 255 222 173 | |
| Wheat | #F5DEB3 | 245 222 179 | |
| Burlywood | #DEB887 | 222 184 135 | |
| Tan | #D2B48C | 210 180 140 | |
| Sandybrown | #F4A460 | 244 164 96 | |
| Orange | #FFA500 | 255 165 0 | |
| Darkorange | #FF8C00 | 255 140 0 | |
| Chocolate | #D2691E | 210 105 30 | |
| Peru | #CD853F | 205 133 63 | |
| Sienna | #A0522D | 160 82 45 | |
| Saddlebrown | #8B4513 | 139 69 19 | |
| Lightyellow | #FFFFE0 | 255 255 224 | |
| Cornsilk | #FFF8DC | 255 248 220 | |
| Lightgoldenrodyellow | #FAFAD2 | 250 250 210 | |
| Lemonchiffon | #FFFACD | 255 250 205 | |
| Palegoldenrod | #EEE8AA | 238 232 170 | |
| Khaki | #F0E68C | 240 230 140 | |
| Yellow | #FFFF00 | 255 255 0 | |
| Gold | #FFD700 | 255 215 0 | |
| Goldenrod | #DAA520 | 218 165 32 | |
| Darkgoldenrod | #B8860B | 184 134 11 | |
| Darkkhaki | #BDB76B | 189 183 107 | |
| Yellowgreen | #9ACD32 | 154 205 50 | |
| Olivedrab | #6B8E23 | 107 142 35 | |
| Olive | #808000 | 128 128 0 | |
| Darkolivegreen | #556B2F | 85 107 47 | |
| Greenyellow | #ADFF2F | 173 255 47 | |
| Chartreuse | #7FFF00 | 127 255 0 | |
| Lawngreen | #7CFC00 | 124 252 0 | |
| Lime | #00FF00 | 0 255 0 | |
| Limegreen | #32CD32 | 50 205 50 | |
| Mintcream | #F5FFFA | 245 255 250 | |
| Honeydew | #F0FFF0 | 240 255 240 | |
| Palegreen | #98FB98 | 152 251 152 | |
| Lightgreen | #90EE90 | 144 238 144 | |
| Springgreen | #00FF7F | 0 255 127 | |
| Mediumspringgreen | #00FA9A | 0 250 154 | |
| Forestgreen | #228B22 | 34 139 34 | |
| Green | #008000 | 0 128 0 | |
| Darkgreen | #006400 | 0 100 0 | |
| Darkseagreen | #8FBC8F | 143 188 143 | |
| Mediumseagreen | #3CB371 | 60 179 113 | |
| Seagreen | #2E8B57 | 46 139 87 | |
| Lightslategray | #778899 | 119 136 153 | |
| Slategray | #708090 | 112 128 144 | |
| Darkslategray | #2F4F4F | 47 79 79 | |
| Aliceblue | #F0F8FF | 240 248 255 | |
| Azure | #F0FFFF | 240 255 255 | |
| Lightcyan | #E0FFFF | 224 255 255 | |
| Paleturquoise | #AFEEEE | 175 238 238 | |
| Aquamarine | #7FFFD4 | 127 255 212 | |
| Mediumaquamarine | #66CDAA | 102 205 170 | |
| Aqua | #00FFFF | 0 255 255 | |
| Turquoise | #40E0D0 | 64 224 208 | |
| Mediumturquoise | #48D1CC | 72 209 204 | |
| Darkturquoise | #00CED1 | 0 206 206 | |
| Lightseagreen | #20B2AA | 32 178 170 | |
| Darkcyan | #008B8B | 0 139 139 | |
| Teal | #008080 | 0 128 128 | |
| Cadetblue | #5F9EA0 | 95 158 160 | |
| Powderblue | #B0E0E6 | 176 224 230 | |
| Lightblue | #ADD8E6 | 173 216 230 | |
| Lightskyblue | #87CEFA | 135 206 250 | |
| Skyblue | #87CEEB | 135 206 235 | |
| Deepskyblue | #00BFFF | 0 191 255 | |
| Dodgerblue | #1E90FF | 30 144 255 | |
| Lavender | #E6E6FA | 230 230 250 | |
| Lightsteelblue | #B0C4DE | 176 196 222 | |
| Cornflowerblue | #6495ED | 100 149 237 | |
| Steelblue | #4682B4 | 70 130 180 | |
| Royalblue | #4169E1 | 65 105 225 | |
| Blue | #0000FF | 0 0 255 | |
| Mediumblue | #0000CD | 0 0 205 | |
| Darkblue | #00008B | 0 0 139 | |
| Navy | #000080 | 0 0 128 | |
| Midnightblue | #191970 | 25 25 112 |
Envie de changement ?
Vous utilisez WordPress ? Quel que soit le thème graphique installé sur votre site, il est possible de modifier le jeu de couleurs de votre webdesign en quelques clics (et si ce n’est pas le cas, Mirobolus peut vous aider à optimiser vos réglages de styles pour gagner en efficacité et en rapidité de chargement de vos pages). Et avec un thème comme DIVI ou Elementor, c’est d’une simplicité enfantine de changer la couleur d’accent de votre site et les polices de caractères.
N’hésitez pas à me contacter, je peux vous accompagner pour relooker votre site.
Il n’est pas toujours nécessaire de tout chambouler : on épure, on allège la feuille de styles et on repart avec des règles plus conforme à votre identité, pour optimiser votre message et toucher plus efficacement votre cible.
Alors on y va ? Êtes-vous prêt pour créer ensemble une identité visuelle qui vous ressemble et qui convertit vos visiteurs en clients ? Prenons rendez-vous pour en parler !
