Adlandırılmış renk · #B8CED9
Light Vanilla Ice
Light Vanilla Ice, #B8CED9: rgb(184 206 217), hsl(200 30% 79%), oklch(0.838 0.028 229.2). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Light Vanilla Ice color name →
#B8CED9
oklch(0.838 0.028 229.2)
Renk dönüşümleri
- HEX
- #b8ced9
- RGB
- rgb(184 206 217)
- HSL
- hsl(200 30% 79%)
- HWB
- hwb(200 72% 15%)
- OKLCH
- oklch(0.838 0.028 229.2)
- OKLab
- oklab(0.838 -0.019 -0.021)
- CIE Lab
- lab(81.36 -5.99 -8.12)
- LCH
- lch(81.36 10.09 233.6)
- CMYK
- cmyk(15% 5% 0% 15%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- BFD3DD
- C6D8E1
- CDDDE4
- D4E1E8
- DBE6EC
- E2EBF0
- E9F0F4
- F1F5F7
- F8FAFB
Koyu tonlar
- A0B3BC
- 8898A1
- 717F86
- 5B666C
- 454E53
- 31383B
- 1E2325
- 0C0F11
- 020202
Gri tonlar
- B2C6D0
- ADBEC7
- A7B6BD
- A1AEB4
- 9CA6AB
- 969EA3
- 91979A
- 8B8F91
- 858889
Renk uyumları
Tamamlayıcı +180°
- B8CED9
Light Vanilla Ice
- DAC5BA
≈ Misty Mink
Analog -30° +30°
- B8CED9
Light Vanilla Ice
- B6D0D1
≈ Lakeside Find
- BFCBDD
≈ Arctic Grey
Üçlü +120° +240°
- B8CED9
Light Vanilla Ice
- D9C3CD
≈ Tip Toes
- CBCCB7
≈ Only Olive
Bölünmüş tamamlayıcı +150° +210°
- B8CED9
Light Vanilla Ice
- DCC3C3
≈ Cameo Appearance
- D4C8B6
≈ Sandstone Cliff
Dörtlü +90° +180° +270°
- B8CED9
Light Vanilla Ice
- D2C4D6
≈ Seedless Grape
- DAC5BA
≈ Misty Mink
- C1CFBD
≈ Mellow Spring
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.63:1 · APCA Lc 28
Ag
AAASiyah üzerinde
WCAG 12.86:1 · APCA Lc 75
En iyi metin rengi: #000000
WCAG 12.86:1 (AAA) · APCA Lc 75
Contrast pairs
Kod parçacıkları
CSS
:root {
--light-vanilla-ice: #b8ced9;
--light-vanilla-ice-rgb: 184 206 217;
--light-vanilla-ice-oklch: oklch(0.838 0.028 229.2);
}
.element {
color: var(--light-vanilla-ice);
background-color: hsl(200 30% 79%);
border-color: oklch(0.838 0.028 229.2);
}Tailwind CSS v4
@theme {
--color-light-vanilla-ice: #b8ced9;
--color-light-vanilla-ice-50: #edf7fc;
--color-light-vanilla-ice-100: #dfeaf0;
--color-light-vanilla-ice-200: #c9d7de;
--color-light-vanilla-ice-300: #aabac3;
--color-light-vanilla-ice-400: #8ea2ac;
--color-light-vanilla-ice-500: #738a95;
--color-light-vanilla-ice-600: #62757e;
--color-light-vanilla-ice-700: #4e5e65;
--color-light-vanilla-ice-800: #38454a;
--color-light-vanilla-ice-900: #272f33;
--color-light-vanilla-ice-950: #151c1f;
}SCSS
$light-vanilla-ice: #b8ced9;
$light-vanilla-ice-rgb: 184, 206, 217;
$light-vanilla-ice-light: mix(#fff, $light-vanilla-ice, 20%);
$light-vanilla-ice-dark: mix(#000, $light-vanilla-ice, 20%);
.element {
color: $light-vanilla-ice;
box-shadow: 0 0 0 2px rgba($light-vanilla-ice, 0.35);
}