Nazwany kolor · #B2D4DD
Blue Glow
Blue Glow to #B2D4DD: rgb(178 212 221), hsl(193 39% 78%), oklch(0.848 0.038 215.5). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Cyan mean? → · Blue Glow color name →
#B2D4DD
oklch(0.848 0.038 215.5)
Konwersje koloru
- HEX
- #b2d4dd
- RGB
- rgb(178 212 221)
- HSL
- hsl(193 39% 78%)
- HWB
- hwb(193 70% 13%)
- OKLCH
- oklch(0.848 0.038 215.5)
- OKLab
- oklab(0.848 -0.031 -0.022)
- CIE Lab
- lab(82.64 -10.22 -8.42)
- LCH
- lch(82.64 13.24 219.5)
- CMYK
- cmyk(19% 4% 0% 13%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- BAD8E0
- C1DDE4
- C9E1E7
- D1E5EB
- D8E9EE
- E0EEF1
- E8F2F5
- F0F6F8
- F7FBFC
Odcienie ciemniejsze
- 9AB8C0
- 839DA4
- 6D8388
- 57696E
- 435155
- 2F3A3D
- 1D2426
- 0C1011
- 010202
Tony
- ADCBD3
- A8C3CA
- A3BAC0
- 9EB2B7
- 99A9AD
- 94A1A4
- 8F989B
- 8A9092
- 858889
Harmonie kolorów
Komplementarna +180°
- B2D4DD
Blue Glow
- E5C5BC
≈ Rose Coloured Glasses
Analogowa -30° +30°
- B2D4DD
Blue Glow
- B2D6D0
≈ Sugar Pool
- B9D0E5
≈ Bewitching Blue
Triada +120° +240°
- B2D4DD
Blue Glow
- DEC4D7
≈ Blissful
- D4CDB2
≈ Ecru Wealth
Komplementarna rozszczepiona +150° +210°
- B2D4DD
Blue Glow
- E4C3C9
≈ Primrose Pink
- DFC9B4
≈ Oat Cake
Tetrada +90° +180° +270°
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.57:1 · APCA Lc 26
Ag
AAANa czerni
WCAG 13.35:1 · APCA Lc 77
Najlepszy kolor tekstu: #000000
WCAG 13.35:1 (AAA) · APCA Lc 77
Contrast pairs
Fragmenty kodu
CSS
:root {
--blue-glow: #b2d4dd;
--blue-glow-rgb: 178 212 221;
--blue-glow-oklch: oklch(0.848 0.038 215.5);
}
.element {
color: var(--blue-glow);
background-color: hsl(193 39% 78%);
border-color: oklch(0.848 0.038 215.5);
}Tailwind CSS v4
@theme {
--color-blue-glow: #b2d4dd;
--color-blue-glow-50: #eaf8fc;
--color-blue-glow-100: #dbebf0;
--color-blue-glow-200: #c3d9df;
--color-blue-glow-300: #a3bdc4;
--color-blue-glow-400: #86a5ad;
--color-blue-glow-500: #698d96;
--color-blue-glow-600: #5a777f;
--color-blue-glow-700: #475f66;
--color-blue-glow-800: #33464a;
--color-blue-glow-900: #233034;
--color-blue-glow-950: #121d1f;
}SCSS
$blue-glow: #b2d4dd;
$blue-glow-rgb: 178, 212, 221;
$blue-glow-light: mix(#fff, $blue-glow, 20%);
$blue-glow-dark: mix(#000, $blue-glow, 20%);
.element {
color: $blue-glow;
box-shadow: 0 0 0 2px rgba($blue-glow, 0.35);
}