Adlandırılmış renk · #CBD4DF
Ephemeral Blue
Ephemeral Blue, #CBD4DF: rgb(203 212 223), hsl(213 24% 84%), oklch(0.866 0.018 253.4). Açık tonlar, koyu tonlar, uyumlar, WCAG ve APCA kontrastı ile CSS, Tailwind v4 ve SCSS kodunu görün.
What does Gray mean? → · Ephemeral Blue color name →
#CBD4DF
oklch(0.866 0.018 253.4)
Renk dönüşümleri
- HEX
- #cbd4df
- RGB
- rgb(203 212 223)
- HSL
- hsl(213 24% 84%)
- HWB
- hwb(213 80% 13%)
- OKLCH
- oklch(0.866 0.018 253.4)
- OKLab
- oklab(0.866 -0.005 -0.017)
- CIE Lab
- lab(84.46 -1.58 -6.56)
- LCH
- lch(84.46 6.74 256.5)
- CMYK
- cmyk(9% 5% 0% 13%)
Açık tonlar · Koyu tonlar · Gri tonlar
Açık tonlar
- D0D8E2
- D5DCE5
- DAE1E9
- E0E5EC
- E5E9EF
- EAEEF2
- EFF2F5
- F4F6F9
- FAFBFC
Koyu tonlar
- B0B8C2
- 969DA5
- 7D838A
- 65696F
- 4D5156
- 373A3D
- 222427
- 0F1012
- 020202
Gri tonlar
- C3CBD5
- BCC3CB
- B4BAC2
- ACB1B8
- A5A9AE
- 9DA1A5
- 96989B
- 8E9092
- 878889
Renk uyumları
Tamamlayıcı +180°
- CBD4DF
Ephemeral Blue
- DAD1C6
≈ Taupe of the Morning
Analog -30° +30°
- CBD4DF
Ephemeral Blue
- C7D6DC
≈ Ice Rink Blue
- D1D2DF
≈ Tranquil Sea
Üçlü +120° +240°
- CBD4DF
Ephemeral Blue
- DFCECF
≈ Light Bunny Soft
- CED6CA
≈ Aspen Mist
Bölünmüş tamamlayıcı +150° +210°
- CBD4DF
Ephemeral Blue
- DED0CA
≈ Watermelon Milk
- D5D4C6
≈ Daikon White
Dörtlü +90° +180° +270°
- CBD4DF
Ephemeral Blue
- DCCFD6
≈ Stardust Ballroom
- DAD1C6
≈ Taupe of the Morning
- C9D7D0
≈ Soft Haze
Kontrast ve erişilebilirlik
Ag
FailBeyaz üzerinde
WCAG 1.49:1 · APCA Lc 23
Ag
AAASiyah üzerinde
WCAG 14.02:1 · APCA Lc 80
En iyi metin rengi: #000000
WCAG 14.02:1 (AAA) · APCA Lc 80
Contrast pairs
Kod parçacıkları
CSS
:root {
--ephemeral-blue: #cbd4df;
--ephemeral-blue-rgb: 203 212 223;
--ephemeral-blue-oklch: oklch(0.866 0.018 253.4);
}
.element {
color: var(--ephemeral-blue);
background-color: hsl(213 24% 84%);
border-color: oklch(0.866 0.018 253.4);
}Tailwind CSS v4
@theme {
--color-ephemeral-blue: #cbd4df;
--color-ephemeral-blue-50: #f2f5fa;
--color-ephemeral-blue-100: #e4e8ee;
--color-ephemeral-blue-200: #cfd5dc;
--color-ephemeral-blue-300: #b1b8c1;
--color-ephemeral-blue-400: #979fa9;
--color-ephemeral-blue-500: #7e8792;
--color-ephemeral-blue-600: #6b727c;
--color-ephemeral-blue-700: #555b63;
--color-ephemeral-blue-800: #3e4349;
--color-ephemeral-blue-900: #2b2e32;
--color-ephemeral-blue-950: #181b1e;
}SCSS
$ephemeral-blue: #cbd4df;
$ephemeral-blue-rgb: 203, 212, 223;
$ephemeral-blue-light: mix(#fff, $ephemeral-blue, 20%);
$ephemeral-blue-dark: mix(#000, $ephemeral-blue, 20%);
.element {
color: $ephemeral-blue;
box-shadow: 0 0 0 2px rgba($ephemeral-blue, 0.35);
}