Le vert est une teinte profonde et classique qui incarne la nature et la vitalité. Il se situe exactement entre le bleu et le jaune sur la roue chromatique—une nuance saturée et essentielle, ni trop claire comme le citron vert, ni trop sombre comme le vert forêt. C'est une couleur idéale pour exprimer la croissance, la stabilité et la richesse du monde naturel, ce qui en fait un choix privilégié dans les designs qui visent à inspirer et à revitaliser.

Le vert est défini par les codes et valeurs de couleur suivants pour garantir la cohérence sur diverses plateformes et appareils numériques.
- Code HEX : #008000
- Valeur RGB : 0 % rouge, 50,2 % vert et 0 % bleu
L'accessibilité joue un rôle crucial dans le choix des couleurs en design UX et UI. La communauté Figma propose des plugins pour s'assurer que vos designs respectent les Web Content Accessibility Guidelines.
Le vert offre un large spectre, de la vivacité rafraîchissante du citron vert à la profondeur apaisante du vert forêt. Cette polyvalence vous permet de tirer parti de ses atouts de manière stratégique :
- Créer une connexion naturelle. L'association inhérente du vert avec la nature le rend idéal pour les marques éco-responsables ou les interfaces liées aux plantes et au bien-être.
- Évoquer l'harmonie et l'équilibre. Les verts plus clairs favorisent un sentiment de calme et de tranquillité, parfaits pour les applications de méditation ou les expériences axées sur la relaxation.
- Signaler la croissance et le succès. Les verts plus clairs peuvent également représenter de nouveaux départs et la croissance, ce qui en fait un bon choix pour les barres de progression ou les messages de confirmation. (Certains sites de commerce électronique utilisent des barres de progression vertes pour représenter la confirmation de commande ou les transactions réussies.)
- Mettre en valeur des éléments importants. Certaines nuances de vert peuvent se démarquer sans submerger l'utilisateur. Utilisez-les pour les boutons d'appel à l'action ou les éléments de navigation principaux pour attirer l'attention tout en maintenant une esthétique épurée.
Gardez à l'esprit que la couleur et sa signification peuvent varier d'une culture à l'autre et à tout moment. Si vous créez une interface pour un public international, renseignez-vous sur la signification des couleurs pour chaque pays concerné.
Pour des variations dans le même spectre verdoyant que le vert, considérez :
- L'émeraude (#006742) incarne l'essence riche et vive de la pierre précieuse, offrant une teinte plus lumineuse et légèrement plus bleutée qui capture l'esprit du vert.
- Le vert Kelly (#4CBB17) est un vert vibrant et pur qui partage l'attrait classique du vert avec un caractère légèrement plus intense et vivant.
- Le vert forêt (#2E6F40) présente une teinte plus profonde et plus subtile, évoquant le feuillage dense d'une canopée forestière et incarnant la tranquillité de la nature.
- Le vert d'eau (#2E8B57) mélange le vert avec une touche de bleu, créant une teinte plus douce et plus atténuée qui reflète les qualités sereines et apaisantes de la mer.
Pour compléter les tons naturels du vert, envisagez de l'associer avec :
- La crème (#FDFBD4) offre un contraste léger et aérien, mettant en valeur la richesse du vert avec sa présence douce et apaisante.
- L'orange brûlé (#BE5103) introduit chaleur et profondeur, créant une palette harmonieuse et terreuse qui renforce l'attrait naturel du vert.
- Le bleu profond (#0000CD) offre un contraste saisissant, mettant en valeur l'énergie vibrante du vert avec sa profondeur audacieuse et profonde.
- Le rose poussiéreux (#DCAE96) ajoute une touche de douceur et de féminité, s'associant délicatement avec le vert pour un look équilibré et délicat.
- Le marron riche (#654321) ancre la palette avec ses tons terreux et robustes, complétant l'essence naturelle du vert pour une ambiance chaleureuse et accueillante.
D'autres couleurs à considérer incluent le gris ardoise pour un fond moderne et neutre, la lavande pour une touche douce et contrastante, et le jaune pour un contraste lumineux et joyeux qui évoque la vivacité du printemps.
Bien que le vert soit remarquablement adaptable, certaines combinaisons peuvent s'avérer moins harmonieuses :
- Le rose néon (#FF69B4) peut être excessivement vibrant, potentiellement en dissonance avec la nature apaisante du vert en créant un contraste visuel saisissant.
- Le rouge vif (#FF0000), bien qu'une combinaison classique de Noël, peut autrement sembler trop audacieux et accablant, détournant de la sérénité naturelle du vert.
- Le violet foncé (#800080), bien que riche et royal, pourrait rivaliser trop fortement avec le vert, conduisant à une palette qui semble trop saturée et moins cohérente.
- Le bleu électrique (#00F0FF), avec son intensité vibrante, pourrait éclipser le vert, créant une palette qui manque d'harmonie et d'équilibre.
- Le jaune vif (#FFFF00), bien qu'un complément naturel dans certains contextes, peut être trop agressif et pourrait dominer la subtilité de certaines nuances de vert, conduisant à un look moins sophistiqué.
Le vert symbolise la croissance, le renouveau et la vie elle-même. En tant que couleur la plus dominante de la nature, il incarne le monde naturel, représentant la fertilité, la fraîcheur et la santé environnementale. Il suggère la stabilité et l'endurance, mettant en lumière la vitalité de la terre et le cycle de la vie.
En psychologie des couleurs, le vert est associé à l'équilibre et à l'harmonie. Il a un effet apaisant, réduisant le stress et favorisant un sentiment de paix et de relaxation. Le vert encourage des sentiments de sécurité, de sûreté et d'espoir, promouvant le bien-être physique et émotionnel. Il stimule la créativité et la productivité, ce qui le rend parfait pour les espaces qui visent à apaiser et à dynamiser.
Dans le design d'interface, le vert peut créer un environnement numérique détendu et accueillant, encourageant l'engagement et signifiant des actions positives, telles que des transactions réussies ou des messages de confirmation. Sa polyvalence le rend adapté à diverses applications, allant de l'évocation du luxe et de l'exclusivité avec des teintes plus sombres à la promotion de la joie et de la vitalité avec des nuances plus claires.
Dans l'Égypte ancienne, le vert représentait la fertilité et la nouvelle vie, ornant les représentations d'Osiris, le dieu de la végétation. De même, les Romains associaient le vert à la victoire et au printemps, utilisant des lauriers verts pour leurs généraux triomphants.
Au Moyen Âge, le vert avait une signification double. Il symbolisait à la fois l'amour courtois et, inversement, l'envie et la maladie. La Renaissance a marqué un tournant. Le développement de pigments verts stables a permis aux artistes de capturer plus précisément les teintes vibrantes de la nature, et le vert est devenu associé à l'harmonie et au statut social en raison de la rareté et du coût de ces nouveaux colorants.
Aux XVIIIe et XIXe siècles, l'invention des colorants synthétiques a rendu le vert plus accessible, influençant la mode et le design d'intérieur. La fin du XIXe siècle a vu le vert prendre une nouvelle symbolique (l'écologisme), reflétant sa connexion historique à la vie et à la croissance.
Variantes de couleur
Nuances
Teintes
Tons
Teintes
Harmonies de couleurs
Complémentaire
Complémentaire fractionnée
Monochrome
Analogue
Triadique
Tétradique
Palettes personnalisées
Green Gables
Avant-Garden
Green Goddess
Vérificateur de contraste
Contraste 5,14
- Texte en grand format
#008000
- Texte normal
Le mode de conception, d'alignement et de création compte. Utilisez Figma.
| Catégorie | ||
|---|---|---|
Conforme | Non conforme | |
Conforme | Conforme | |
Conforme | Conforme |
Contraste 4,09
- Texte en grand format
#008000
- Texte normal
Le mode de conception, d'alignement et de création compte. Utilisez Figma.
| Catégorie | ||
|---|---|---|
Non conforme | Non conforme | |
Conforme | Non conforme | |
Conforme | Non conforme |
Simulations de couleurs
Protanopie
Deutéranopie
Tritanopie
Achromatopsie
La couleur hexadécimale #008000, connue sous le nom de vert, a des valeurs RVB de R:0, G:128, B:0 et des valeurs CMJN de C:100, M:0, Y:100, K:50.
| VALUE | CSS | |
|---|---|---|
| HEX | #008000 | #008000 |
| RGB DECIMAL | 0, 128, 0 | RGB(0,128,0) |
| RGB PERCENTAGE | 0.0, 50.2, 0.0 | RGB(0.0%,50.2%,0.0%) |
| CMYK | 100, 0, 100, 50 | |
| HSL | HSL(120.0, 100.0%, 25.1%) | HSL(120.0, 100.0%, 25.1%) |
| HSV (OR HSB) | 120.0°, 100.0, 50.2 | |
| WEB SAFE | #01530 | #01530 |
| BINARY | 00000000, 10000000, 00000000 | |
| iOS - SwiftUI | Color(red: 0.000, green: 0.502, blue: 0.000) | |
| iOS - UIKit | UIColor(red: 0.000, green: 0.502, blue: 0.000, alpha: 1) | |
| Android - Compose | Color(0xFF008000) |


