Benannte Farbe · #C4D6E1
Blue Raindrop
Blue Raindrop ist #C4D6E1: rgb(196 214 225), hsl(203 33% 83%), oklch(0.866 0.025 234.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Blue Raindrop color name →
#C4D6E1
oklch(0.866 0.025 234.5)
Farbumrechnungen
- HEX
- #c4d6e1
- RGB
- rgb(196 214 225)
- HSL
- hsl(203 33% 83%)
- HWB
- hwb(203 77% 12%)
- OKLCH
- oklch(0.866 0.025 234.5)
- OKLab
- oklab(0.866 -0.014 -0.02)
- CIE Lab
- lab(84.51 -4.62 -7.61)
- LCH
- lch(84.51 8.91 238.7)
- CMYK
- cmyk(13% 5% 0% 12%)
Tints · Shades · Tones
Tints
- CADAE4
- D0DEE7
- D6E2EA
- DBE6ED
- E1EAF0
- E7EEF3
- EDF3F6
- F3F7F9
- F9FBFC
Shades
- AABAC4
- 919EA7
- 78848B
- 616A70
- 4A5256
- 353B3E
- 212527
- 0E1012
- 020202
Tones
- BDCDD7
- B6C4CD
- AFBBC3
- A8B3B9
- A1AAAF
- 9BA1A6
- 94999C
- 8D9193
- 878889
Farbharmonien
Komplementär +180°
- C4D6E1
Blue Raindrop
- E1CFC4
≈ Winsome Beige
Analog -30° +30°
- C4D6E1
Blue Raindrop
- C1D8DA
≈ Haint Blue
- CBD3E4
≈ English Channel Fog
Triadisch +120° +240°
- C4D6E1
Blue Raindrop
- E1CDD4
≈ Prim
- D2D5C3
≈ White Sage
Geteilt komplementär +150° +210°
- C4D6E1
Blue Raindrop
- E3CDCB
≈ Whirligig
- DAD2C1
≈ Clam
Tetradisch +90° +180° +270°
- C4D6E1
Blue Raindrop
- DBCEDC
≈ Violet Mist
- E1CFC4
≈ Winsome Beige
- C9D7C9
≈ Falling Star
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.49:1 · APCA Lc 23
Ag
AAAAuf Schwarz
WCAG 14.05:1 · APCA Lc 80
Beste Textfarbe: #000000
WCAG 14.05:1 (AAA) · APCA Lc 80
Contrast pairs
Code-Snippets
CSS
:root {
--blue-raindrop: #c4d6e1;
--blue-raindrop-rgb: 196 214 225;
--blue-raindrop-oklch: oklch(0.866 0.025 234.5);
}
.element {
color: var(--blue-raindrop);
background-color: hsl(203 33% 83%);
border-color: oklch(0.866 0.025 234.5);
}Tailwind CSS v4
@theme {
--color-blue-raindrop: #c4d6e1;
--color-blue-raindrop-50: #eff6fb;
--color-blue-raindrop-100: #e0e9ef;
--color-blue-raindrop-200: #cbd6de;
--color-blue-raindrop-300: #acbac3;
--color-blue-raindrop-400: #91a1ab;
--color-blue-raindrop-500: #778994;
--color-blue-raindrop-600: #65747d;
--color-blue-raindrop-700: #505d64;
--color-blue-raindrop-800: #3a444a;
--color-blue-raindrop-900: #282f33;
--color-blue-raindrop-950: #161c1f;
}SCSS
$blue-raindrop: #c4d6e1;
$blue-raindrop-rgb: 196, 214, 225;
$blue-raindrop-light: mix(#fff, $blue-raindrop, 20%);
$blue-raindrop-dark: mix(#000, $blue-raindrop, 20%);
.element {
color: $blue-raindrop;
box-shadow: 0 0 0 2px rgba($blue-raindrop, 0.35);
}