Named color · #E9EDBD
Spring Blossom
Spring Blossom is #E9EDBD: rgb(233 237 189), hsl(65 57% 84%), oklch(0.931 0.063 111.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Spring Blossom color name →
#E9EDBD
oklch(0.931 0.063 111.5)
Color conversions
- HEX
- #e9edbd
- RGB
- rgb(233 237 189)
- HSL
- hsl(65 57% 84%)
- HWB
- hwb(65 74% 7%)
- OKLCH
- oklch(0.931 0.063 111.5)
- OKLab
- oklab(0.931 -0.023 0.058)
- CIE Lab
- lab(92.54 -7.16 22.9)
- LCH
- lch(92.54 23.99 107.4)
- CMYK
- cmyk(2% 0% 20% 7%)
Tints · Shades · Tones
Tints
- EBEFC4
- EDF1CA
- EFF3D1
- F2F4D8
- F4F6DE
- F6F8E5
- F8FAEB
- FAFBF2
- FDFDF8
Shades
- CBCEA4
- ADB08C
- 909374
- 74775D
- 5A5C47
- 414233
- 292A1F
- 13140D
- 030302
Tones
- DEE2B7
- D3D6B1
- C8CBAB
- BEC0A5
- B3B59F
- A9AA98
- 9E9F92
- 94958C
- 8A8A86
Color harmonies
Complementary +180°
- E9EDBD
Spring Blossom
- E8E5FF
≈ Lavender Mist
Analogous -30° +30°
- E9EDBD
Spring Blossom
- FEE5B9
≈ Butter Creme
- D2F3CD
≈ Fresh Lime
Triadic +120° +240°
- E9EDBD
Spring Blossom
- CEEEFF
≈ Blue Hijab
- FFDEEB
≈ Baby Girl
Split-complementary +150° +210°
- E9EDBD
Spring Blossom
- DCE9FF
≈ Cloudless
- FADDFF
≈ Sugarpills
Tetradic +90° +180° +270°
- E9EDBD
Spring Blossom
- B7F5FA
≈ Pale Sky
- E8E5FF
≈ Lavender Mist
- FFE0DE
≈ Red Remains
Contrast & accessibility
Ag
FailOn white
WCAG 1.21:1 · APCA Lc 10
Ag
AAAOn black
WCAG 17.31:1 · APCA Lc 94
Best text color: #000000
WCAG 17.31:1 (AAA) · APCA Lc 94
Contrast pairs
Code snippets
CSS
:root {
--spring-blossom: #e9edbd;
--spring-blossom-rgb: 233 237 189;
--spring-blossom-oklch: oklch(0.931 0.063 111.5);
}
.element {
color: var(--spring-blossom);
background-color: hsl(65 57% 84%);
border-color: oklch(0.931 0.063 111.5);
}Tailwind CSS v4
@theme {
--color-spring-blossom: #e9edbd;
--color-spring-blossom-50: #f5f7e3;
--color-spring-blossom-100: #e7ebd3;
--color-spring-blossom-200: #d4d8b9;
--color-spring-blossom-300: #b7bb97;
--color-spring-blossom-400: #9fa278;
--color-spring-blossom-500: #878b59;
--color-spring-blossom-600: #72754c;
--color-spring-blossom-700: #5b5e3c;
--color-spring-blossom-800: #44442b;
--color-spring-blossom-900: #2f2f1d;
--color-spring-blossom-950: #1b1c0d;
}SCSS
$spring-blossom: #e9edbd;
$spring-blossom-rgb: 233, 237, 189;
$spring-blossom-light: mix(#fff, $spring-blossom, 20%);
$spring-blossom-dark: mix(#000, $spring-blossom, 20%);
.element {
color: $spring-blossom;
box-shadow: 0 0 0 2px rgba($spring-blossom, 0.35);
}