Named color · #FFD84D
Tuscan Sun
Tuscan Sun is #FFD84D: rgb(255 216 77), hsl(47 100% 65%), oklch(0.892 0.157 93). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Tuscan Sun color name →
#FFD84D
oklch(0.892 0.157 93)
Color conversions
- HEX
- #ffd84d
- RGB
- rgb(255 216 77)
- HSL
- hsl(47 100% 65%)
- HWB
- hwb(47 30% 0%)
- OKLCH
- oklch(0.892 0.157 93)
- OKLab
- oklab(0.892 -0.008 0.157)
- CIE Lab
- lab(87.93 3.75 70.19)
- LCH
- lch(87.93 70.29 86.9)
- CMYK
- cmyk(0% 15% 70% 0%)
Tints · Shades · Tones
Tints
- FFDC66
- FFE17B
- FFE58E
- FFE9A0
- FFEDB1
- FFF1C1
- FFF4D1
- FFF8E1
- FFFCF0
Shades
- DEBC42
- BEA037
- 9E852C
- 806B22
- 635318
- 483B0F
- 2E2507
- 161102
- 030200
Tones
- F2CF58
- E4C661
- D7BD68
- CAB56E
- BEAC72
- B1A376
- A49A7A
- 98927C
- 8C897E
Color harmonies
Complementary +180°
- FFD84D
Tuscan Sun
- CFDAFF
≈ Icy Plains
Analogous -30° +30°
- FFD84D
Tuscan Sun
- FFD1A9
≈ Opalescent Coral
- C8EC6F
≈ Venomous Sting
Triadic +120° +240°
- FFD84D
Tuscan Sun
- 91EBFF
≈ Photon Projector
- FFC6F4
≈ Rosy Maple Moth
Split-complementary +150° +210°
- FFD84D
Tuscan Sun
- BBE1FF
≈ Dithered Sky
- E3D2FF
≈ Pale Lavender
Tetradic +90° +180° +270°
- FFD84D
Tuscan Sun
- 16FCE5
≈ Vibrant Mint
- CFDAFF
≈ Icy Plains
- FFCBD7
≈ Flower Spell
Contrast & accessibility
Ag
FailOn white
WCAG 1.38:1 · APCA Lc 19
Ag
AAAOn black
WCAG 15.18:1 · APCA Lc 85
Best text color: #000000
WCAG 15.18:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--tuscan-sun: #ffd84d;
--tuscan-sun-rgb: 255 216 77;
--tuscan-sun-oklch: oklch(0.892 0.157 93);
}
.element {
color: var(--tuscan-sun);
background-color: hsl(47 100% 65%);
border-color: oklch(0.892 0.157 93);
}Tailwind CSS v4
@theme {
--color-tuscan-sun: #ffd84d;
--color-tuscan-sun-50: #fff6c3;
--color-tuscan-sun-100: #f8e8ac;
--color-tuscan-sun-200: #e9d485;
--color-tuscan-sun-300: #d1b64f;
--color-tuscan-sun-400: #be9b00;
--color-tuscan-sun-500: #aa8000;
--color-tuscan-sun-600: #906d00;
--color-tuscan-sun-700: #735700;
--color-tuscan-sun-800: #573f00;
--color-tuscan-sun-900: #3c2b00;
--color-tuscan-sun-950: #261800;
}SCSS
$tuscan-sun: #ffd84d;
$tuscan-sun-rgb: 255, 216, 77;
$tuscan-sun-light: mix(#fff, $tuscan-sun, 20%);
$tuscan-sun-dark: mix(#000, $tuscan-sun, 20%);
.element {
color: $tuscan-sun;
box-shadow: 0 0 0 2px rgba($tuscan-sun, 0.35);
}