Named color · #F1F8EC
Garden Dawn
Garden Dawn is #F1F8EC: rgb(241 248 236), hsl(95 46% 95%), oklch(0.971 0.017 131.9). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Garden Dawn color name →
#F1F8EC
oklch(0.971 0.017 131.9)
Color conversions
- HEX
- #f1f8ec
- RGB
- rgb(241 248 236)
- HSL
- hsl(95 46% 95%)
- HWB
- hwb(95 93% 3%)
- OKLCH
- oklch(0.971 0.017 131.9)
- OKLab
- oklab(0.971 -0.012 0.013)
- CIE Lab
- lab(96.8 -3.97 4.94)
- LCH
- lch(96.8 6.33 128.8)
- CMYK
- cmyk(3% 0% 5% 3%)
Tints · Shades · Tones
Tints
- F2F9EE
- F4F9F0
- F5FAF2
- F7FBF4
- F8FCF5
- F9FCF7
- FBFDF9
- FCFEFB
- FEFEFD
Shades
- D2D8CD
- B3B8AF
- 959A92
- 797C76
- 5D605B
- 434542
- 2B2C29
- 141513
- 030303
Tones
- E5EBE1
- D9DFD5
- CED3CA
- C2C6BF
- B7BAB5
- ACAEAA
- A0A29F
- 969795
- 8B8B8A
Color harmonies
Complementary +180°
- F1F8EC
Garden Dawn
- F9F2FE
≈ Sugar Crystal
Analogous -30° +30°
- F1F8EC
Garden Dawn
- F7F6E9
≈ Nun Orchid
- ECF9F2
≈ Soft Petals
Triadic +120° +240°
- F1F8EC
Garden Dawn
- EFF6FF
≈ Alice Blue
- FFF2F3
≈ Glimpse of Pink
Split-complementary +150° +210°
- F1F8EC
Garden Dawn
- F3F4FF
≈ Sugar Crystal
- FEF1F9
≈ Pinkish White
Tetradic +90° +180° +270°
- F1F8EC
Garden Dawn
- E9F8FE
≈ Clear Skies
- F9F2FE
≈ Sugar Crystal
- FFF2ED
≈ Polished Pink
Contrast & accessibility
Ag
FailOn white
WCAG 1.08:1 · APCA Lc 0
Ag
AAAOn black
WCAG 19.37:1 · APCA Lc 102
Best text color: #000000
WCAG 19.37:1 (AAA) · APCA Lc 102
Contrast pairs
Code snippets
CSS
:root {
--garden-dawn: #f1f8ec;
--garden-dawn-rgb: 241 248 236;
--garden-dawn-oklch: oklch(0.971 0.017 131.9);
}
.element {
color: var(--garden-dawn);
background-color: hsl(95 46% 95%);
border-color: oklch(0.971 0.017 131.9);
}Tailwind CSS v4
@theme {
--color-garden-dawn: #f1f8ec;
--color-garden-dawn-50: #f3f6f1;
--color-garden-dawn-100: #e5e9e3;
--color-garden-dawn-200: #d1d6ce;
--color-garden-dawn-300: #b4b9b0;
--color-garden-dawn-400: #9ba196;
--color-garden-dawn-500: #82897d;
--color-garden-dawn-600: #6e746a;
--color-garden-dawn-700: #585d55;
--color-garden-dawn-800: #40443d;
--color-garden-dawn-900: #2c2f2a;
--color-garden-dawn-950: #191b18;
}SCSS
$garden-dawn: #f1f8ec;
$garden-dawn-rgb: 241, 248, 236;
$garden-dawn-light: mix(#fff, $garden-dawn, 20%);
$garden-dawn-dark: mix(#000, $garden-dawn, 20%);
.element {
color: $garden-dawn;
box-shadow: 0 0 0 2px rgba($garden-dawn, 0.35);
}