Named color · #FFDE73
Sun Shower
Sun Shower is #FFDE73: rgb(255 222 115), hsl(46 100% 73%), oklch(0.907 0.131 92.5). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Sun Shower color name →
#FFDE73
oklch(0.907 0.131 92.5)
Color conversions
- HEX
- #ffde73
- RGB
- rgb(255 222 115)
- HSL
- hsl(46 100% 73%)
- HWB
- hwb(46 45% 0%)
- OKLCH
- oklch(0.907 0.131 92.5)
- OKLab
- oklab(0.907 -0.006 0.131)
- CIE Lab
- lab(89.7 2.57 56.05)
- LCH
- lch(89.7 56.1 87.4)
- CMYK
- cmyk(0% 13% 55% 0%)
Tints · Shades · Tones
Tints
- FFE284
- FFE593
- FFE9A2
- FFECB0
- FFEFBE
- FFF3CB
- FFF6D9
- FFF9E5
- FFFCF2
Shades
- DEC163
- BEA554
- 9E8945
- 806F36
- 635528
- 483D1B
- 2E260F
- 161205
- 030201
Tones
- F2D477
- E4CB7A
- D7C17C
- CAB87E
- BEAE7F
- B1A580
- A49C81
- 989281
- 8C8981
Color harmonies
Complementary +180°
- FFDE73
Sun Shower
- D6DFFF
≈ Transparent Blue
Analogous -30° +30°
- FFDE73
Sun Shower
- FFD8B7
≈ Alishan Dawn
- D1EF89
≈ Laced Green
Triadic +120° +240°
- FFDE73
Sun Shower
- A3EFFF
≈ Beyond the Clouds
- FFCFF6
≈ Shampoo
Split-complementary +150° +210°
- FFDE73
Sun Shower
- C5E5FF
≈ Fresh Water
- E7D8FF
≈ Lavender Savour
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 1.31:1 · APCA Lc 16
Ag
AAAOn black
WCAG 15.94:1 · APCA Lc 88
Best text color: #000000
WCAG 15.94:1 (AAA) · APCA Lc 88
Contrast pairs
Code snippets
CSS
:root {
--sun-shower: #ffde73;
--sun-shower-rgb: 255 222 115;
--sun-shower-oklch: oklch(0.907 0.131 92.5);
}
.element {
color: var(--sun-shower);
background-color: hsl(46 100% 73%);
border-color: oklch(0.907 0.131 92.5);
}Tailwind CSS v4
@theme {
--color-sun-shower: #ffde73;
--color-sun-shower-50: #fff5cb;
--color-sun-shower-100: #f6e8b7;
--color-sun-shower-200: #e6d493;
--color-sun-shower-300: #cdb765;
--color-sun-shower-400: #ba9c33;
--color-sun-shower-500: #a58200;
--color-sun-shower-600: #8b6e00;
--color-sun-shower-700: #705800;
--color-sun-shower-800: #543f00;
--color-sun-shower-900: #3a2c00;
--color-sun-shower-950: #241900;
}SCSS
$sun-shower: #ffde73;
$sun-shower-rgb: 255, 222, 115;
$sun-shower-light: mix(#fff, $sun-shower, 20%);
$sun-shower-dark: mix(#000, $sun-shower, 20%);
.element {
color: $sun-shower;
box-shadow: 0 0 0 2px rgba($sun-shower, 0.35);
}