Adlandırılmış renk · #B5CED4
Starlight Blue
Starlight Blue, #B5CED4: rgb(181 206 212), hsl(192 26% 77%), oklch(0.835 0.028 213.8). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Starlight Blue color name →
#B5CED4
oklch(0.835 0.028 213.8)
Renk dönüşümleri
- HEX
- #b5ced4
- RGB
- rgb(181 206 212)
- HSL
- hsl(192 26% 77%)
- HWB
- hwb(192 71% 17%)
- OKLCH
- oklch(0.835 0.028 213.8)
- OKLab
- oklab(0.835 -0.023 -0.016)
- CIE Lab
- lab(81.03 -7.77 -5.98)
- LCH
- lch(81.03 9.81 217.6)
- CMYK
- cmyk(15% 3% 0% 17%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BCD3D8
- C4D8DD
- CBDDE1
- D2E1E5
- DAE6E9
- E1EBEE
- E9F0F2
- F0F5F6
- F8FAFB
Koyu tonlar
- 9DB3B8
- 86989D
- 6F7F83
- 596669
- 444E51
- 30383A
- 1D2324
- 0C0F10
- 020202
Gri tonlar
- B0C6CB
- AABEC3
- A5B6BA
- A0AEB2
- 9AA6A9
- 959EA1
- 909798
- 8A8F90
- 858888
Renk uyumları
Tamamlayıcı +180°
- B5CED4
Starlight Blue
- DAC3BD
≈ Summer Beige
Analog -30° +30°
- B5CED4
Starlight Blue
- B6CFCB
≈ Turquoise Grey
- BACBDA
≈ Arctic Grey
Üçlü +120° +240°
- B5CED4
Starlight Blue
- D5C2D1
≈ Chinaberry Bloom
- CFC9B5
≈ Coliseum Marble
Bölünmüş tamamlayıcı +150° +210°
- B5CED4
Starlight Blue
- DAC2C7
≈ Old Mission Pink
- D6C5B6
≈ Beige Chalk
Dörtlü +90° +180° +270°
- B5CED4
Starlight Blue
- CCC5D8
≈ Lilac Crystal
- DAC3BD
≈ Summer Beige
- C5CCB8
≈ Mellow Spring
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.64:1 · APCA Lc 29
Ag
AAASiyah üzerinde
WCAG 12.74:1 · APCA Lc 74
En iyi metin rengi: #000000
WCAG 12.74:1 (AAA) · APCA Lc 74
Contrast pairs
Kod parçacıkları
CSS
:root {
--starlight-blue: #b5ced4;
--starlight-blue-rgb: 181 206 212;
--starlight-blue-oklch: oklch(0.835 0.028 213.8);
}
.element {
color: var(--starlight-blue);
background-color: hsl(192 26% 77%);
border-color: oklch(0.835 0.028 213.8);
}Tailwind CSS v4
@theme {
--color-starlight-blue: #b5ced4;
--color-starlight-blue-50: #edf7fa;
--color-starlight-blue-100: #deeaee;
--color-starlight-blue-200: #c8d8dc;
--color-starlight-blue-300: #a8bbc1;
--color-starlight-blue-400: #8ca3a9;
--color-starlight-blue-500: #718b92;
--color-starlight-blue-600: #60767b;
--color-starlight-blue-700: #4d5e63;
--color-starlight-blue-800: #374548;
--color-starlight-blue-900: #263032;
--color-starlight-blue-950: #141c1e;
}SCSS
$starlight-blue: #b5ced4;
$starlight-blue-rgb: 181, 206, 212;
$starlight-blue-light: mix(#fff, $starlight-blue, 20%);
$starlight-blue-dark: mix(#000, $starlight-blue, 20%);
.element {
color: $starlight-blue;
box-shadow: 0 0 0 2px rgba($starlight-blue, 0.35);
}