Le cyan est une couleur éclatante et vive qui se situe directement entre le bleu et le vert sur la roue chromatique. Il appartient au spectre des tons froids et possède une qualité limpide, semblable à l'eau. Bien qu'il soit proche du bleu électrique, le cyan présente une nuance légèrement plus verte, ce qui donne une teinte plus froide et plus douce.
Le cyan 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 : #00FFFF
- Valeur RGB : 0 % rouge, 100 % vert, et 100 % 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.
Voici quelques façons d'utiliser le cyan dans vos designs :
- Favoriser la tranquillité. Le ton rafraîchissant du cyan est parfait pour les sites web ou applications promouvant la relaxation, la productivité ou le bien-être mental.
- Mettre en avant des éléments clés. La vivacité du cyan attire l'attention sur des éléments importants comme les liens, les boutons ou les éléments de menu.
- Exprimer la créativité et l'innovation. Les entreprises technologiques et les marques ciblant un public jeune utilisent souvent le cyan pour créer une sensation de fraîcheur.
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 bleu-vert vif que le cyan, considérez :
- Bleu électrique (#00F0FF) est similaire au cyan en termes de vivacité mais penche plus vers le bleu.
- Aqua (#00FFF0) tend plus vers le vert mais partage un ton froid similaire au cyan.
- Turquoise (#40E0D0) est une teinte bleu-vert similaire mais plus verte et plus foncée que le cyan.
Pour compléter le cyan, envisagez de l'associer avec :
- Blanc (#FFFFFF) crée un contraste propre et aérien, mettant en valeur la luminosité du cyan.
- Bleu marine (#000080) ajoute une touche de sophistication à une palette monochromatique.
- Jaune (#FFFF00) est un accord complémentaire au cyan, créant une ambiance énergique.
- Gunmetal (#353E43) est un gris foncé qui donne au cyan un effet moderne et dramatique.
- Rouge pastel (#FF746C) est un contrepoint doux à la fraîcheur du cyan, créant une combinaison accrocheuse.
Associer le cyan à des couleurs complémentaires comme le magenta et le jaune crée des designs audacieux et accrocheurs. Pour quelque chose de plus détendu, associez-le à des nuances de bleu ou à des neutres comme le gris et le beige.
Bien que le cyan soit lumineux et à ton froid, il peut entrer en dissonance avec :
- Mimosa (#F2B949) est un jaune qui penche vers le chaud en raison de ses sous-tons orangés, ce qui entre en dissonance avec la nature à ton froid du cyan.
- Sauge (#BBB791) est un vert atténué qui peut sembler terne à côté de la luminosité du cyan, créant un manque de contraste.
- Bordeaux (#550000) peut dominer le cyan, le rendant déséquilibré.
- Marron (#895129) peut ternir la vivacité du cyan, créant une sensation de lourdeur.
Dans la culture chinoise, le cyan est une couleur porte-bonheur associée à l'espoir et à l'honneur. La mythologie chinoise présente le Dragon Azur (souvent représenté dans des teintes cyan) comme le gardien de l'Est, symbolisant le printemps, la nature et l'énergie vitale.
En psychologie des couleurs, le cyan est associé à la sérénité et à la clarté mentale. Ses tons froids sont censés améliorer la concentration et favoriser une atmosphère tranquille et concentrée, ce qui le rend idéal pour les environnements où le calme et la pensée claire sont des objectifs. La connexion de la couleur à des scènes naturelles rafraîchissantes, comme les eaux tropicales et les paysages glacés, aide à évoquer un sentiment de vitalité et de rajeunissement.
Dans le design d'interface, la vivacité du cyan peut attirer l'attention sur des éléments essentiels. Son esthétique propre et moderne s'intègre bien aux tendances de design contemporaines, ajoutant un look frais et dynamique aux interfaces numériques.
Le mot "cyan" vient du mot grec ancien "kyanos", qui désignait un minéral bleu profond utilisé pour créer des pigments. Ce pigment était prisé pour sa couleur riche et était utilisé pour créer des teintures bleues luxueuses pour les textiles et les œuvres d'art.
Le mot "cyan" pour décrire la couleur est relativement récent. Il a été utilisé pour la première fois en anglais en 1879 par un imprimeur et photographe, Edward Steichen. Il l'a utilisé pour décrire l'une des couleurs de son impression du spectre solaire. Cela était significatif car cela a permis de faire une distinction claire entre le cyan et la catégorie plus large des teintes bleu-vert.
Aujourd'hui, le cyan est utilisé comme couleur primaire dans le modèle de couleur CMJN pour l'impression. Ce modèle repose sur le cyan, le magenta, le jaune et le noir pour créer le spectre des couleurs imprimées.
Variantes de couleur
Nuances
Teintes
Tons
Teintes
Harmonies de couleurs
Complémentaire
Complémentaire fractionnée
Monochrome
Analogue
Triadique
Tétradique
Palettes personnalisées
Sérénité Cyan
Terre Néon
Renaissance Fraîche
Vérificateur de contraste
Contraste 1,25
- Texte en grand format
#00FFFF
- Texte normal
Le mode de conception, d'alignement et de création compte. Utilisez Figma.
| Catégorie | ||
|---|---|---|
Non conforme | Non conforme | |
Non conforme | Non conforme | |
Non conforme | Non conforme |
Contraste 16,75
- Texte en grand format
#00FFFF
- Texte normal
Le mode de conception, d'alignement et de création compte. Utilisez Figma.
| Catégorie | ||
|---|---|---|
Conforme | Conforme | |
Conforme | Conforme | |
Conforme | Conforme |
Simulations de couleurs
Protanopie
Deutéranopie
Tritanopie
Achromatopsie
La couleur hexadécimale #00ffff, connue sous le nom de Cyan, a des valeurs RVB de R:0, G:255, B:255 et des valeurs CMJN de C:100, M:0, Y:0, K:0.
| VALUE | CSS | |
|---|---|---|
| HEX | #00ffff | #00ffff |
| RGB DECIMAL | 0, 255, 255 | RGB(0,255,255) |
| RGB PERCENTAGE | 0.0, 100.0, 100.0 | RGB(0.0%,100.0%,100.0%) |
| CMYK | 100, 0, 0, 0 | |
| HSL | HSL(180.0, 100.0%, 50.0%) | HSL(180.0, 100.0%, 50.0%) |
| HSV (OR HSB) | 180.0°, 100.0, 100.0 | |
| WEB SAFE | #0255255 | #0255255 |
| BINARY | 00000000, 11111111, 11111111 | |
| iOS - SwiftUI | Color(red: 0.000, green: 1.000, blue: 1.000) | |
| iOS - UIKit | UIColor(red: 0.000, green: 1.000, blue: 1.000, alpha: 1) | |
| Android - Compose | Color(0xFF00FFFF) |