Couleur nommée la plus proche · #9AB5EA
#9AB5EA
Couleur nommée la plus proche: Pastel Blue
#9AB5EA (rgb(154 181 234), hsl(220 66% 76%), oklch(0.772 0.082 263.6)) est la plus proche de la couleur nommée Pastel Blue. Teintes, ombres, harmonies, contraste WCAG et APCA, et code CSS, Tailwind v4 et SCSS.
#9AB5EA
oklch(0.772 0.082 263.6)
Conversions de couleur
- HEX
- #9ab5ea
- RGB
- rgb(154 181 234)
- HSL
- hsl(220 66% 76%)
- HWB
- hwb(220 60% 8%)
- OKLCH
- oklch(0.772 0.082 263.6)
- OKLab
- oklab(0.772 -0.009 -0.081)
- CIE Lab
- lab(73.09 -0.07 -29.86)
- LCH
- lch(73.09 29.86 269.9)
- CMYK
- cmyk(34% 23% 0% 8%)
Teintes · Ombres · Tons
Teintes
- A4BCEC
- AEC4EF
- B8CBF1
- C2D3F3
- CCDAF5
- D6E1F7
- E0E9F9
- EAF0FB
- F5F8FD
Ombres
- 859DCB
- 7186AE
- 5E6F91
- 4B5975
- 39445A
- 273041
- 171D29
- 090C13
- 010203
Tons
- 97B0DF
- 95AAD4
- 92A5CA
- 90A0BF
- 8D9AB4
- 8B95AA
- 88909F
- 858B95
- 83858A
Harmonies de couleurs
Complémentaire +180°
- 9AB5EA
Pastel Blue
- CEB178
≈ Aged Seagrass
Analogue -30° +30°
- 9AB5EA
Pastel Blue
- 7FBEE1
≈ Horizon Haze
- B7ABE5
≈ Maximum Blue Purple
Triadique +120° +240°
- 9AB5EA
Pastel Blue
- E5A19C
≈ Bussell Lace
- 96C394
≈ Velvet Leaf
Complémentaire divisée +150° +210°
- 9AB5EA
Pastel Blue
- DFA783
≈ Almost Apricot
- B4BB7E
≈ Grass Cloth
Tétradique +90° +180° +270°
- 9AB5EA
Pastel Blue
- DF9FB9
≈ Blushing Tulip
- CEB178
≈ Aged Seagrass
- 7BC6B0
≈ Meridian Star
Contraste et accessibilité
Ag
FailSur blanc
WCAG 2.06:1 · APCA Lc 40
Ag
AAASur noir
WCAG 10.17:1 · APCA Lc 62
Meilleure couleur de texte: #000000
WCAG 10.17:1 (AAA) · APCA Lc 62
Contrast pairs
Extraits de code
CSS
:root {
--pastel-blue: #9ab5ea;
--pastel-blue-rgb: 154 181 234;
--pastel-blue-oklch: oklch(0.772 0.082 263.6);
}
.element {
color: var(--pastel-blue);
background-color: hsl(220 66% 76%);
border-color: oklch(0.772 0.082 263.6);
}Tailwind CSS v4
@theme {
--color-pastel-blue: #9ab5ea;
--color-pastel-blue-50: #eaf5ff;
--color-pastel-blue-100: #dbe8ff;
--color-pastel-blue-200: #c4d4f8;
--color-pastel-blue-300: #a3b7e2;
--color-pastel-blue-400: #859ed0;
--color-pastel-blue-500: #6a86bd;
--color-pastel-blue-600: #5a719f;
--color-pastel-blue-700: #485a80;
--color-pastel-blue-800: #32425f;
--color-pastel-blue-900: #222e43;
--color-pastel-blue-950: #111b2b;
}SCSS
$pastel-blue: #9ab5ea;
$pastel-blue-rgb: 154, 181, 234;
$pastel-blue-light: mix(#fff, $pastel-blue, 20%);
$pastel-blue-dark: mix(#000, $pastel-blue, 20%);
.element {
color: $pastel-blue;
box-shadow: 0 0 0 2px rgba($pastel-blue, 0.35);
}