Named color · #DCC449
Yellow Magic Orchestra
Yellow Magic Orchestra is #DCC449: rgb(220 196 73), hsl(50 68% 57%), oklch(0.818 0.142 98.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Yellow Magic Orchestra color name →
#DCC449
oklch(0.818 0.142 98.1)
Color conversions
- HEX
- #dcc449
- RGB
- rgb(220 196 73)
- HSL
- hsl(50 68% 57%)
- HWB
- hwb(50 29% 14%)
- OKLCH
- oklch(0.818 0.142 98.1)
- OKLab
- oklab(0.818 -0.02 0.14)
- CIE Lab
- lab(79.56 -1.23 62.23)
- LCH
- lch(79.56 62.25 91.1)
- CMYK
- cmyk(0% 11% 67% 14%)
Tints · Shades · Tones
Tints
- DFCA61
- E3D076
- E6D689
- EADC9B
- EDE2AC
- F1E8BD
- F4EECE
- F8F4DE
- FBF9EF
Shades
- BFAA3E
- A39134
- 88782A
- 6E6120
- 544A17
- 3C350E
- 262106
- 110E02
- 020200
Tones
- D2BD53
- C9B65C
- BFB063
- B6A969
- ADA26E
- A49B73
- 9A9577
- 928E7A
- 89877D
Color harmonies
Complementary +180°
- DCC449
Yellow Magic Orchestra
- B5BEFF
≈ Dried Lilac
Analogous -30° +30°
- DCC449
Yellow Magic Orchestra
- FFB154
≈ Cantaloupe Smile
- A9D56C
≈ Lime Lizard
Triadic +120° +240°
- DCC449
Yellow Magic Orchestra
- 30D8FF
≈ Neon Blue
- FF9EE3
≈ Rose Daphne
Split-complementary +150° +210°
- DCC449
Yellow Magic Orchestra
- 92C9FF
≈ Clear Sky
- D9AFFF
≈ Mauve
Tetradic +90° +180° +270°
- DCC449
Yellow Magic Orchestra
- 05E0D5
≈ Mint Morning
- B5BEFF
≈ Dried Lilac
- FFA7B6
≈ A Brand New Day
Contrast & accessibility
Ag
FailOn white
WCAG 1.74:1 · APCA Lc 32
Ag
AAAOn black
WCAG 12.03:1 · APCA Lc 71
Best text color: #000000
WCAG 12.03:1 (AAA) · APCA Lc 71
Contrast pairs
Code snippets
CSS
:root {
--yellow-magic-orchestra: #dcc449;
--yellow-magic-orchestra-rgb: 220 196 73;
--yellow-magic-orchestra-oklch: oklch(0.818 0.142 98.1);
}
.element {
color: var(--yellow-magic-orchestra);
background-color: hsl(50 68% 57%);
border-color: oklch(0.818 0.142 98.1);
}Tailwind CSS v4
@theme {
--color-yellow-magic-orchestra: #dcc449;
--color-yellow-magic-orchestra-50: #fef7c8;
--color-yellow-magic-orchestra-100: #f2eab3;
--color-yellow-magic-orchestra-200: #e2d68f;
--color-yellow-magic-orchestra-300: #c8b95e;
--color-yellow-magic-orchestra-400: #b59e23;
--color-yellow-magic-orchestra-500: #a08500;
--color-yellow-magic-orchestra-600: #877100;
--color-yellow-magic-orchestra-700: #6c5a00;
--color-yellow-magic-orchestra-800: #514100;
--color-yellow-magic-orchestra-900: #382d00;
--color-yellow-magic-orchestra-950: #231a00;
}SCSS
$yellow-magic-orchestra: #dcc449;
$yellow-magic-orchestra-rgb: 220, 196, 73;
$yellow-magic-orchestra-light: mix(#fff, $yellow-magic-orchestra, 20%);
$yellow-magic-orchestra-dark: mix(#000, $yellow-magic-orchestra, 20%);
.element {
color: $yellow-magic-orchestra;
box-shadow: 0 0 0 2px rgba($yellow-magic-orchestra, 0.35);
}