Nazwany kolor · #C8D8E8
Light Placid Blue
Light Placid Blue to #C8D8E8: rgb(200 216 232), hsl(210 41% 85%), oklch(0.875 0.028 248.1). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Light Placid Blue color name →
#C8D8E8
oklch(0.875 0.028 248.1)
Konwersje koloru
- HEX
- #c8d8e8
- RGB
- rgb(200 216 232)
- HSL
- hsl(210 41% 85%)
- HWB
- hwb(210 78% 9%)
- OKLCH
- oklch(0.875 0.028 248.1)
- OKLab
- oklab(0.875 -0.01 -0.026)
- CIE Lab
- lab(85.49 -3.18 -9.82)
- LCH
- lch(85.49 10.33 252)
- CMYK
- cmyk(14% 7% 0% 9%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- CDDCEA
- D3E0ED
- D8E4EF
- DEE8F1
- E3EBF4
- E9EFF6
- EEF3F8
- F4F7FA
- F9FBFD
Odcienie ciemniejsze
- AEBCCA
- 94A0AC
- 7B8590
- 636B74
- 4C5359
- 363B40
- 212529
- 0F1113
- 020203
Tony
- C1CFDD
- B9C6D2
- B2BDC8
- ABB4BD
- A3ABB3
- 9CA2A8
- 959A9E
- 8E9194
- 87888A
Harmonie kolorów
Komplementarna +180°
- C8D8E8
Light Placid Blue
- E3D3C3
≈ Sand Dune
Analogowa -30° +30°
- C8D8E8
Light Placid Blue
- C2DBE2
≈ Washing Powder White
- D1D5E9
≈ Chill in the Air
Triada +120° +240°
- C8D8E8
Light Placid Blue
- E8CFD2
≈ Salmon Cream
- D0DAC6
≈ Duchamp Light Green
Komplementarna rozszczepiona +150° +210°
- C8D8E8
Light Placid Blue
- E7D0C9
≈ Pianissimo
- DAD6C2
≈ Angora Whisper
Tetrada +90° +180° +270°
- C8D8E8
Light Placid Blue
- E3CFDC
≈ Summer Clover
- E3D3C3
≈ Sand Dune
- C7DCCF
≈ Tenderness
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.45:1 · APCA Lc 22
Ag
AAANa czerni
WCAG 14.44:1 · APCA Lc 82
Najlepszy kolor tekstu: #000000
WCAG 14.44:1 (AAA) · APCA Lc 82
Contrast pairs
Fragmenty kodu
CSS
:root {
--light-placid-blue: #c8d8e8;
--light-placid-blue-rgb: 200 216 232;
--light-placid-blue-oklch: oklch(0.875 0.028 248.1);
}
.element {
color: var(--light-placid-blue);
background-color: hsl(210 41% 85%);
border-color: oklch(0.875 0.028 248.1);
}Tailwind CSS v4
@theme {
--color-light-placid-blue: #c8d8e8;
--color-light-placid-blue-50: #eff6fd;
--color-light-placid-blue-100: #e1e9f1;
--color-light-placid-blue-200: #ccd5e0;
--color-light-placid-blue-300: #adb9c6;
--color-light-placid-blue-400: #92a0af;
--color-light-placid-blue-500: #788898;
--color-light-placid-blue-600: #667381;
--color-light-placid-blue-700: #515c67;
--color-light-placid-blue-800: #3b444c;
--color-light-placid-blue-900: #282f35;
--color-light-placid-blue-950: #161b20;
}SCSS
$light-placid-blue: #c8d8e8;
$light-placid-blue-rgb: 200, 216, 232;
$light-placid-blue-light: mix(#fff, $light-placid-blue, 20%);
$light-placid-blue-dark: mix(#000, $light-placid-blue, 20%);
.element {
color: $light-placid-blue;
box-shadow: 0 0 0 2px rgba($light-placid-blue, 0.35);
}