Named color · #D0D418
Sun Flooded Woods
Sun Flooded Woods is #D0D418: rgb(208 212 24), hsl(61 80% 46%), oklch(0.839 0.181 111.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Sun Flooded Woods color name →
#D0D418
oklch(0.839 0.181 111.1)
Color conversions
- HEX
- #d0d418
- RGB
- rgb(208 212 24)
- HSL
- hsl(61 80% 46%)
- HWB
- hwb(61 9% 17%)
- OKLCH
- oklch(0.839 0.181 111.1)
- OKLab
- oklab(0.839 -0.065 0.169)
- CIE Lab
- lab(82.53 -15.16 78.3)
- LCH
- lch(82.53 79.76 101)
- CMYK
- cmyk(2% 0% 89% 17%)
Tints · Shades · Tones
Tints
- D4D948
- D9DD64
- DDE27B
- E2E691
- E6EBA4
- EBEFB7
- F0F3CA
- F5F7DC
- FAFBED
Shades
- B5B813
- 9A9D0F
- 80830A
- 676907
- 4F5104
- 393A02
- 232401
- 101000
- 020200
Tones
- C7CC36
- BFC348
- B7BB54
- AFB25E
- A6AA66
- 9EA26D
- 979973
- 8F9178
- 87887C
Color harmonies
Complementary +180°
- D0D418
Sun Flooded Woods
- CAC1FF
≈ Lavender Tonic
Analogous -30° +30°
- D0D418
Sun Flooded Woods
- FFBE32
≈ Vibrant Honey
- 82E772
≈ Amazon Parrot
Triadic +120° +240°
- D0D418
Sun Flooded Woods
- 84D6FF
≈ Kul Sharif Blue
- FFAED2
≈ Spaghetti Strap Pink
Split-complementary +150° +210°
- D0D418
Sun Flooded Woods
- ADCBFF
≈ Night Snow
- F2ADFF
≈ Pink Sugar
Tetradic +90° +180° +270°
- D0D418
Sun Flooded Woods
- 00E5F0
≈ Cold Heights
- CAC1FF
≈ Lavender Tonic
- FFB4B1
≈ Wildflower Bouquet
Contrast & accessibility
Ag
FailOn white
WCAG 1.60:1 · APCA Lc 27
Ag
AAAOn black
WCAG 13.11:1 · APCA Lc 76
Best text color: #000000
WCAG 13.11:1 (AAA) · APCA Lc 76
Contrast pairs
Code snippets
CSS
:root {
--sun-flooded-woods: #d0d418;
--sun-flooded-woods-rgb: 208 212 24;
--sun-flooded-woods-oklch: oklch(0.839 0.181 111.1);
}
.element {
color: var(--sun-flooded-woods);
background-color: hsl(61 80% 46%);
border-color: oklch(0.839 0.181 111.1);
}Tailwind CSS v4
@theme {
--color-sun-flooded-woods: #d0d418;
--color-sun-flooded-woods-50: #f5fbc0;
--color-sun-flooded-woods-100: #e8efa9;
--color-sun-flooded-woods-200: #d4dd80;
--color-sun-flooded-woods-300: #b8c146;
--color-sun-flooded-woods-400: #a4a700;
--color-sun-flooded-woods-500: #8e8e00;
--color-sun-flooded-woods-600: #787800;
--color-sun-flooded-woods-700: #606000;
--color-sun-flooded-woods-800: #484600;
--color-sun-flooded-woods-900: #323000;
--color-sun-flooded-woods-950: #1e1c00;
}SCSS
$sun-flooded-woods: #d0d418;
$sun-flooded-woods-rgb: 208, 212, 24;
$sun-flooded-woods-light: mix(#fff, $sun-flooded-woods, 20%);
$sun-flooded-woods-dark: mix(#000, $sun-flooded-woods, 20%);
.element {
color: $sun-flooded-woods;
box-shadow: 0 0 0 2px rgba($sun-flooded-woods, 0.35);
}