Named color · #D3E0B8
Spring Glow
Spring Glow is #D3E0B8: rgb(211 224 184), hsl(80 39% 80%), oklch(0.886 0.055 122.2). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Spring Glow color name →
#D3E0B8
oklch(0.886 0.055 122.2)
Color conversions
- HEX
- #d3e0b8
- RGB
- rgb(211 224 184)
- HSL
- hsl(80 39% 80%)
- HWB
- hwb(80 72% 12%)
- OKLCH
- oklch(0.886 0.055 122.2)
- OKLab
- oklab(0.886 -0.029 0.047)
- CIE Lab
- lab(87.41 -9.63 18.13)
- LCH
- lch(87.41 20.53 118)
- CMYK
- cmyk(6% 0% 18% 12%)
Tints · Shades · Tones
Tints
- D7E3BF
- DCE6C6
- E0E9CD
- E4ECD4
- E9F0DB
- EDF3E3
- F2F6EA
- F6F9F1
- FBFCF8
Shades
- B7C3A0
- 9CA688
- 828A71
- 69705B
- 515645
- 3A3E31
- 24271E
- 10120C
- 020202
Tones
- CAD6B2
- C2CCAD
- B9C2A7
- B1B9A2
- A9AF9C
- A0A596
- 989C91
- 90928B
- 888986
Color harmonies
Complementary +180°
- D3E0B8
Spring Glow
- E0D2F9
≈ Pale Lavender
Analogous -30° +30°
- D3E0B8
Spring Glow
- E6D9B1
≈ Honey Mist
- BFE5C8
≈ Spearmints
Triadic +120° +240°
- D3E0B8
Spring Glow
- BBDFFC
≈ Dithered Sky
- FACBD6
≈ Palace Rose
Split-complementary +150° +210°
- D3E0B8
Spring Glow
- CDD8FF
≈ Pale Phthalo Blue
- F0CDEA
≈ Bubblegum Crisis
Tetradic +90° +180° +270°
- D3E0B8
Spring Glow
- B0E4EF
≈ Crystal River
- E0D2F9
≈ Pale Lavender
- FCCDC3
≈ Full Bloom
Contrast & accessibility
Ag
FailOn white
WCAG 1.38:1 · APCA Lc 19
Ag
AAAOn black
WCAG 15.12:1 · APCA Lc 85
Best text color: #000000
WCAG 15.12:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--spring-glow: #d3e0b8;
--spring-glow-rgb: 211 224 184;
--spring-glow-oklch: oklch(0.886 0.055 122.2);
}
.element {
color: var(--spring-glow);
background-color: hsl(80 39% 80%);
border-color: oklch(0.886 0.055 122.2);
}Tailwind CSS v4
@theme {
--color-spring-glow: #d3e0b8;
--color-spring-glow-50: #f2f8e7;
--color-spring-glow-100: #e4ebd8;
--color-spring-glow-200: #cfd9bf;
--color-spring-glow-300: #b1bd9e;
--color-spring-glow-400: #99a480;
--color-spring-glow-500: #808c63;
--color-spring-glow-600: #6c7754;
--color-spring-glow-700: #565f43;
--color-spring-glow-800: #404530;
--color-spring-glow-900: #2c3020;
--color-spring-glow-950: #191c10;
}SCSS
$spring-glow: #d3e0b8;
$spring-glow-rgb: 211, 224, 184;
$spring-glow-light: mix(#fff, $spring-glow, 20%);
$spring-glow-dark: mix(#000, $spring-glow, 20%);
.element {
color: $spring-glow;
box-shadow: 0 0 0 2px rgba($spring-glow, 0.35);
}