Named color · #FFD400
Cyber Yellow
Cyber Yellow is #FFD400: rgb(255 212 0), hsl(50 100% 50%), oklch(0.881 0.181 94). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Cyber Yellow color name →
#FFD400
oklch(0.881 0.181 94)
Color conversions
- HEX
- #ffd400
- RGB
- rgb(255 212 0)
- HSL
- hsl(50 100% 50%)
- HWB
- hwb(50 0% 0%)
- OKLCH
- oklch(0.881 0.181 94)
- OKLab
- oklab(0.881 -0.013 0.18)
- CIE Lab
- lab(86.73 4.36 86.07)
- LCH
- lch(86.73 86.18 87.1)
- CMYK
- cmyk(0% 17% 100% 0%)
Tints · Shades · Tones
Tints
- FFD945
- FFDE63
- FFE27C
- FFE791
- FFEBA5
- FFEFB8
- FFF3CB
- FFF7DC
- FFFBEE
Shades
- DEB800
- BE9D00
- 9E8300
- 806900
- 635100
- 483A00
- 2E2400
- 161000
- 030200
Tones
- F2CC32
- E4C346
- D7BB54
- CAB35E
- BEAA67
- B1A26E
- A49973
- 989178
- 8C897D
Color harmonies
Complementary +180°
- FFD400
Cyber Yellow
- CBD6FF
≈ Pale Phthalo Blue
Analogous -30° +30°
- FFD400
Cyber Yellow
- FFCD9F
≈ Melon Sprinkle
- BFEB55
≈ Energos
Triadic +120° +240°
- FFD400
Cyber Yellow
- 87E9FF
≈ Photon Projector
- FFC1F2
≈ Pink Quartz
Split-complementary +150° +210°
- FFD400
Cyber Yellow
- B5DDFF
≈ Broad Daylight
- E2CDFF
≈ Lens Flare Pink
Tetradic +90° +180° +270°
- FFD400
Cyber Yellow
- 00F8E3
≈ Bright Aqua
- CBD6FF
≈ Pale Phthalo Blue
- FFC6D3
≈ Sweet Serenade
Contrast & accessibility
Ag
FailOn white
WCAG 1.43:1 · APCA Lc 20
Ag
AAAOn black
WCAG 14.66:1 · APCA Lc 83
Best text color: #000000
WCAG 14.66:1 (AAA) · APCA Lc 83
Contrast pairs
Code snippets
CSS
:root {
--cyber-yellow: #ffd400;
--cyber-yellow-rgb: 255 212 0;
--cyber-yellow-oklch: oklch(0.881 0.181 94);
}
.element {
color: var(--cyber-yellow);
background-color: hsl(50 100% 50%);
border-color: oklch(0.881 0.181 94);
}Tailwind CSS v4
@theme {
--color-cyber-yellow: #ffd400;
--color-cyber-yellow-50: #fff6bb;
--color-cyber-yellow-100: #fae8a2;
--color-cyber-yellow-200: #ebd476;
--color-cyber-yellow-300: #d3b634;
--color-cyber-yellow-400: #c29a00;
--color-cyber-yellow-500: #ae7f00;
--color-cyber-yellow-600: #936c00;
--color-cyber-yellow-700: #765600;
--color-cyber-yellow-800: #593e00;
--color-cyber-yellow-900: #3e2b00;
--color-cyber-yellow-950: #271800;
}SCSS
$cyber-yellow: #ffd400;
$cyber-yellow-rgb: 255, 212, 0;
$cyber-yellow-light: mix(#fff, $cyber-yellow, 20%);
$cyber-yellow-dark: mix(#000, $cyber-yellow, 20%);
.element {
color: $cyber-yellow;
box-shadow: 0 0 0 2px rgba($cyber-yellow, 0.35);
}