En yakın adlandırılmış renk · #9AB5EA
#9AB5EA
En yakın adlandırılmış renk: Pastel Blue
#9AB5EA (rgb(154 181 234), hsl(220 66% 76%), oklch(0.772 0.082 263.6)) en çok Pastel Blue adlı renge yakındır. Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
#9AB5EA
oklch(0.772 0.082 263.6)
Renk dönüşümleri
- 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%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- A4BCEC
- AEC4EF
- B8CBF1
- C2D3F3
- CCDAF5
- D6E1F7
- E0E9F9
- EAF0FB
- F5F8FD
Koyu tonlar
- 859DCB
- 7186AE
- 5E6F91
- 4B5975
- 39445A
- 273041
- 171D29
- 090C13
- 010203
Gri tonlar
- 97B0DF
- 95AAD4
- 92A5CA
- 90A0BF
- 8D9AB4
- 8B95AA
- 88909F
- 858B95
- 83858A
Renk uyumları
Tamamlayıcı +180°
- 9AB5EA
Pastel Blue
- CEB178
≈ Aged Seagrass
Analog -30° +30°
- 9AB5EA
Pastel Blue
- 7FBEE1
≈ Horizon Haze
- B7ABE5
≈ Maximum Blue Purple
Üçlü +120° +240°
- 9AB5EA
Pastel Blue
- E5A19C
≈ Bussell Lace
- 96C394
≈ Velvet Leaf
Bölünmüş tamamlayıcı +150° +210°
- 9AB5EA
Pastel Blue
- DFA783
≈ Almost Apricot
- B4BB7E
≈ Grass Cloth
Dörtlü +90° +180° +270°
- 9AB5EA
Pastel Blue
- DF9FB9
≈ Blushing Tulip
- CEB178
≈ Aged Seagrass
- 7BC6B0
≈ Meridian Star
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 2.06:1 · APCA Lc 40
Ag
AAASiyah üzerinde
WCAG 10.17:1 · APCA Lc 62
En iyi metin rengi: #000000
WCAG 10.17:1 (AAA) · APCA Lc 62
Contrast pairs
Kod parçacıkları
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);
}