Nazwany kolor · #CBDCE2
Sea Foam Mist
Sea Foam Mist to #CBDCE2: rgb(203 220 226), hsl(196 28% 84%), oklch(0.884 0.02 220.9). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Gray mean? → · Sea Foam Mist color name →
#CBDCE2
oklch(0.884 0.02 220.9)
Konwersje koloru
- HEX
- #cbdce2
- RGB
- rgb(203 220 226)
- HSL
- hsl(196 28% 84%)
- HWB
- hwb(196 80% 11%)
- OKLCH
- oklch(0.884 0.02 220.9)
- OKLab
- oklab(0.884 -0.015 -0.013)
- CIE Lab
- lab(86.61 -5.02 -5.01)
- LCH
- lch(86.61 7.09 224.9)
- CMYK
- cmyk(10% 3% 0% 11%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- D0DFE5
- D5E3E8
- DAE6EB
- E0EAEE
- E5EDF0
- EAF1F3
- EFF4F6
- F5F8F9
- FAFBFC
Odcienie ciemniejsze
- B0BFC4
- 96A3A8
- 7D888C
- 656E71
- 4D5457
- 373C3E
- 222627
- 0F1112
- 020203
Tony
- C3D2D8
- BCC9CE
- B4BFC4
- ACB6BA
- A5ADB0
- 9DA4A6
- 969B9C
- 8F9293
- 878989
Harmonie kolorów
Komplementarna +180°
- CBDCE2
Sea Foam Mist
- E5D5CF
≈ Ocean Sand
Analogowa -30° +30°
- CBDCE2
Sea Foam Mist
- CADDDC
≈ Light Relax
- CFDAE6
≈ Blue Silk
Triada +120° +240°
- CBDCE2
Sea Foam Mist
- E2D4DD
≈ Soft Lilac
- DBD9CA
≈ Light Cargo River
Komplementarna rozszczepiona +150° +210°
- CBDCE2
Sea Foam Mist
- E5D4D5
≈ Demure
- E1D7CB
≈ Always Neutral
Tetrada +90° +180° +270°
- CBDCE2
Sea Foam Mist
- DDD5E3
≈ Light Modesty
- E5D5CF
≈ Ocean Sand
- D4DCCE
≈ Caribbean Pleasure
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.41:1 · APCA Lc 20
Ag
AAANa czerni
WCAG 14.87:1 · APCA Lc 84
Najlepszy kolor tekstu: #000000
WCAG 14.87:1 (AAA) · APCA Lc 84
Contrast pairs
Fragmenty kodu
CSS
:root {
--sea-foam-mist: #cbdce2;
--sea-foam-mist-rgb: 203 220 226;
--sea-foam-mist-oklch: oklch(0.884 0.02 220.9);
}
.element {
color: var(--sea-foam-mist);
background-color: hsl(196 28% 84%);
border-color: oklch(0.884 0.02 220.9);
}Tailwind CSS v4
@theme {
--color-sea-foam-mist: #cbdce2;
--color-sea-foam-mist-50: #eff6f9;
--color-sea-foam-mist-100: #e1e9ed;
--color-sea-foam-mist-200: #ccd6da;
--color-sea-foam-mist-300: #adbabf;
--color-sea-foam-mist-400: #92a1a7;
--color-sea-foam-mist-500: #788a90;
--color-sea-foam-mist-600: #667479;
--color-sea-foam-mist-700: #515d61;
--color-sea-foam-mist-800: #3b4447;
--color-sea-foam-mist-900: #282f31;
--color-sea-foam-mist-950: #161c1d;
}SCSS
$sea-foam-mist: #cbdce2;
$sea-foam-mist-rgb: 203, 220, 226;
$sea-foam-mist-light: mix(#fff, $sea-foam-mist, 20%);
$sea-foam-mist-dark: mix(#000, $sea-foam-mist, 20%);
.element {
color: $sea-foam-mist;
box-shadow: 0 0 0 2px rgba($sea-foam-mist, 0.35);
}