Nearest named color · #EDEAF6
#EDEAF6
Nearest named color: Cloud Break
#EDEAF6 (rgb(237 234 246), hsl(255 40% 94%), oklch(0.943 0.016 297.5)) is closest to the named color Cloud Break. See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
#EDEAF6
oklch(0.943 0.016 297.5)
Color conversions
- HEX
- #edeaf6
- RGB
- rgb(237 234 246)
- HSL
- hsl(255 40% 94%)
- HWB
- hwb(255 92% 4%)
- OKLCH
- oklch(0.943 0.016 297.5)
- OKLab
- oklab(0.943 0.008 -0.014)
- CIE Lab
- lab(93.2 2.66 -5.45)
- LCH
- lch(93.2 6.06 296)
- CMYK
- cmyk(4% 5% 0% 4%)
Tints · Shades · Tones
Tints
- EFECF7
- F1EEF8
- F2F0F9
- F4F2FA
- F6F4FB
- F8F7FB
- FAF9FC
- FBFBFD
- FDFDFE
Shades
- CECBD6
- B0AEB7
- 939198
- 77757B
- 5C5A5F
- 424145
- 2A292C
- 141315
- 030303
Tones
- E2DFEA
- D6D4DD
- CBC9D1
- C0BEC5
- B5B4B9
- AAA9AE
- 9F9FA2
- 959496
- 8A8A8B
Color harmonies
Complementary +180°
- EDEAF6
Cloud Break
- EBEEE2
≈ Creamy Garlic
Analogous -30° +30°
- EDEAF6
Cloud Break
- E7ECF8
≈ Coconut White
- F2E8F2
≈ Perfume Haze
Triadic +120° +240°
- EDEAF6
Cloud Break
- F5EAE2
≈ Spooled White
- E1F0EC
≈ Himalayan Mist
Split-complementary +150° +210°
- EDEAF6
Cloud Break
- F1ECE0
≈ Paper Plane
- E5EFE6
≈ Stone Path
Tetradic +90° +180° +270°
- EDEAF6
Cloud Break
- F7E8E6
≈ Pink Duet
- EBEEE2
≈ Creamy Garlic
- E0EFF2
≈ Azul Primavera
Contrast & accessibility
Ag
FailOn white
WCAG 1.18:1 · APCA Lc 9
Ag
AAAOn black
WCAG 17.70:1 · APCA Lc 95
Best text color: #000000
WCAG 17.70:1 (AAA) · APCA Lc 95
Contrast pairs
Code snippets
CSS
:root {
--cloud-break: #edeaf6;
--cloud-break-rgb: 237 234 246;
--cloud-break-oklch: oklch(0.943 0.016 297.5);
}
.element {
color: var(--cloud-break);
background-color: hsl(255 40% 94%);
border-color: oklch(0.943 0.016 297.5);
}Tailwind CSS v4
@theme {
--color-cloud-break: #edeaf6;
--color-cloud-break-50: #f6f4f9;
--color-cloud-break-100: #e8e7ed;
--color-cloud-break-200: #d5d3da;
--color-cloud-break-300: #b8b6bf;
--color-cloud-break-400: #9f9da7;
--color-cloud-break-500: #878490;
--color-cloud-break-600: #72707a;
--color-cloud-break-700: #5b5961;
--color-cloud-break-800: #434148;
--color-cloud-break-900: #2e2d32;
--color-cloud-break-950: #1b1a1e;
}SCSS
$cloud-break: #edeaf6;
$cloud-break-rgb: 237, 234, 246;
$cloud-break-light: mix(#fff, $cloud-break, 20%);
$cloud-break-dark: mix(#000, $cloud-break, 20%);
.element {
color: $cloud-break;
box-shadow: 0 0 0 2px rgba($cloud-break, 0.35);
}