Azure #F0FFFF
Azure est un ton très clair proche du gris neutre, de code hex #F0FFFF et de valeur RGB rgb(240, 255, 255).
Aa
Le texte noir est le plus lisible sur cette couleur (20.45:1).
À propos de cette couleur
#F0FFFF est un ton très clair proche du gris neutre. En OKLCH, sa luminosité est de 99 %, son chroma de 0.016. Son chroma est trop faible pour tirer vers le chaud ou le froid. C’est la couleur nommée Azure. Le texte noir y est le plus lisible, avec un rapport de 20.45:1.
| Famille de teinte | Neutres |
| Luminosité | très clair (99%) |
| Chroma | proche du gris neutre (0.016) |
| Température | neutre |
| Nom le plus proche | Azure |
| Texte noir | 20.45:1 |
| Texte blanc | 1.02:1 |
Couleurs qui vont avec Azure
Accords obtenus en faisant tourner Azure sur la roue des teintes OKLCH, chacun nommé d’après l’entrée la plus proche de notre liste.
Complémentaire
La teinte opposée (180°).
Analogue
Teintes voisines, 30° de chaque côté.
Triadique
Trois teintes espacées de 120°.
Palettes de couleurs avec Azure
Palettes sélectionnées contenant une couleur à moins de ΔE 0,06 (OKLab) de Azure, les plus proches d’abord.
Couleurs nommées similaires
Les huit couleurs nommées les plus proches de Azure, avec leur distance ΔE.
- Mint Cream #F5FFFA ΔE 0.009
- Cultured #F8F9FA ΔE 0.016
- Pale Grey #FDFDFE ΔE 0.017
- Alice Blue #F0F8FF ΔE 0.018
- White #FFFFFF ΔE 0.019
- Light Cyan #E0FFFF ΔE 0.020
- Ghost White #F8F8FF ΔE 0.020
- Honeydew #F0FFF0 ΔE 0.020
En savoir plus sur Azure
Comment obtenir Azure
Une recette de départ avec des couleurs de peinture courantes, calculée avec un modèle spectral de peinture (le mode peinture du mélangeur). Les vrais pigments varient : faites d’abord un petit essai, puis ajustez.
- 1 part de blanc
Résultat de la recette : #FFFFFF, un écart de ΔE 0.019 par rapport à Azure. C’est très proche : la plupart des gens ne verront pas la différence.
Quelles couleurs donnent le gris ? | Tableau de mélange des couleurs
Codes de Azure dans tous les formats
| HEX | #F0FFFF |
| RGB | rgb(240, 255, 255) |
| HSL | hsl(180, 100%, 97%) |
| OKLCH | oklch(98.9% 0.016 196.9) |
Contraste
Les rapports de contraste WCAG 2 sont la cible de conformité : AA exige 4,5:1 pour le texte courant et 3:1 pour le grand texte, AAA exige 7:1. Les valeurs APCA Lc sont un complément issu des brouillons de WCAG 3.
| Paire | WCAG 2 | Résultat | APCA | Recommandation APCA |
|---|---|---|---|---|
| Texte blanc sur #F0FFFF | 1.02:1 | Échec | Lc 0.0 | Illisible |
| Texte noir sur #F0FFFF | 20.45:1 | AAA | Lc 104.2 | Recommandé pour le texte courant |
| Texte #F0FFFF sur blanc | 1.02:1 | Échec | Lc 0.0 | Illisible |
| Texte #F0FFFF sur noir | 20.45:1 | AAA | Lc -105.8 | Recommandé pour le texte courant |
Teintes et nuances de Azure
Une échelle 50–950 construite en OKLCH : la teinte est conservée, la luminosité suit une courbe proche de Tailwind v4, et chaque palier reste dans le gamut sRGB. Cette couleur correspond au palier 50.
-
Palier 50
50 (cette couleur)
#F0FFFF
oklch(98.9% 0.016 196.9)
-
Palier 100
100
#E6EBEB
oklch(93.6% 0.005 197.1)
-
Palier 200
200
#D1DBDB
oklch(88.4% 0.011 197)
-
Palier 300
300
#B2C5C5
oklch(80.9% 0.021 196.7)
-
Palier 400
400
#8AA7A7
oklch(70.7% 0.032 196.4)
-
Palier 500
500
#6C9292
oklch(63.2% 0.042 196.1)
-
Palier 600
600
#537C7C
oklch(55.6% 0.046 195.9)
-
Palier 700
700
#446869
oklch(49.1% 0.041 198.1)
-
Palier 800
800
#385555
oklch(42.7% 0.035 195.9)
-
Palier 900
900
#314646
oklch(37.7% 0.026 196.1)
-
Palier 950
950
#1D2929
oklch(27% 0.017 196.2)
Exporter cette échelle pour Tailwind avec l’outil Couleurs Tailwind
Azure et daltonisme
Simulé avec le modèle de Machado et al. (2009). ΔE indique de combien la couleur se déplace : en dessous d’environ 0,02, le changement passe inaperçu.
| Vision | Perçue comme | Écart (ΔE) |
|---|---|---|
| Protanopie (sans cônes rouges) | #FDFDFF | 0.017 |
| Deutéranopie (sans cônes verts) | #FAFBFF | 0.016 |
| Tritanopie (sans cônes bleus) | #ECFFFF | 0.005 |
| Achromatopsie (sans couleur) | #FCFCFC | 0.016 |
Utilisez Azure dans votre produit
Transformez-la en rôles d’interface clairs et sombres au contraste vérifié, puis exportez vers Tailwind v4, shadcn/ui, CSS ou design tokens.