Benannte Farbe · #98BDDD
Sleeping Easy
Sleeping Easy ist #98BDDD: rgb(152 189 221), hsl(208 50% 73%), oklch(0.782 0.061 244.8). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Blue mean? → · Sleeping Easy color name →
#98BDDD
oklch(0.782 0.061 244.8)
Farbumrechnungen
- HEX
- #98bddd
- RGB
- rgb(152 189 221)
- HSL
- hsl(208 50% 73%)
- HWB
- hwb(208 60% 13%)
- OKLCH
- oklch(0.782 0.061 244.8)
- OKLab
- oklab(0.782 -0.026 -0.055)
- CIE Lab
- lab(74.73 -7.21 -20.38)
- LCH
- lch(74.73 21.62 250.5)
- CMYK
- cmyk(31% 14% 0% 13%)
Tints · Shades · Tones
Tints
- A2C4E1
- ACCAE4
- B7D1E8
- C1D7EB
- CBDEEE
- D5E4F2
- E0EBF5
- EAF2F8
- F5F8FC
Shades
- 84A4C0
- 708CA4
- 5C7488
- 4A5D6E
- 384755
- 27333D
- 171F26
- 080D11
- 010202
Tones
- 96B7D3
- 94B1CA
- 91AAC0
- 8FA4B7
- 8D9EAE
- 8A98A4
- 88929B
- 858C92
- 838689
Farbharmonien
Komplementär +180°
- 98BDDD
Sleeping Easy
- D4B190
≈ Cinnamon Frost
Analog -30° +30°
- 98BDDD
Sleeping Easy
- 8BC3D0
≈ After the Rain
- ACB6E0
≈ Sassy Violet
Triadisch +120° +240°
- 98BDDD
Sleeping Easy
- DBA9B3
≈ Pink Nectar
- AFBF95
≈ Bavarian Hops
Geteilt komplementär +150° +210°
- 98BDDD
Sleeping Easy
- DCAB9E
≈ Tamanegi Peel
- C4B88C
≈ Bakelite Yellow
Tetradisch +90° +180° +270°
- 98BDDD
Sleeping Easy
- D1AAC8
≈ Heart to Heart
- D4B190
≈ Cinnamon Frost
- 9AC4A7
≈ Mini Green
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.97:1 · APCA Lc 38
Ag
AAAAuf Schwarz
WCAG 10.65:1 · APCA Lc 64
Beste Textfarbe: #000000
WCAG 10.65:1 (AAA) · APCA Lc 64
Contrast pairs
Code-Snippets
CSS
:root {
--sleeping-easy: #98bddd;
--sleeping-easy-rgb: 152 189 221;
--sleeping-easy-oklch: oklch(0.782 0.061 244.8);
}
.element {
color: var(--sleeping-easy);
background-color: hsl(208 50% 73%);
border-color: oklch(0.782 0.061 244.8);
}Tailwind CSS v4
@theme {
--color-sleeping-easy: #98bddd;
--color-sleeping-easy-50: #e8f7ff;
--color-sleeping-easy-100: #d8eafc;
--color-sleeping-easy-200: #c0d7ed;
--color-sleeping-easy-300: #9fbbd5;
--color-sleeping-easy-400: #81a3c0;
--color-sleeping-easy-500: #648bac;
--color-sleeping-easy-600: #557591;
--color-sleeping-easy-700: #435e75;
--color-sleeping-easy-800: #304556;
--color-sleeping-easy-900: #20303c;
--color-sleeping-easy-950: #101c26;
}SCSS
$sleeping-easy: #98bddd;
$sleeping-easy-rgb: 152, 189, 221;
$sleeping-easy-light: mix(#fff, $sleeping-easy, 20%);
$sleeping-easy-dark: mix(#000, $sleeping-easy, 20%);
.element {
color: $sleeping-easy;
box-shadow: 0 0 0 2px rgba($sleeping-easy, 0.35);
}