Named color · #FFD800
School Bus
School Bus is #FFD800: rgb(255 216 0), hsl(51 100% 50%), oklch(0.889 0.183 95.8). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · School Bus color name →
#FFD800
oklch(0.889 0.183 95.8)
Color conversions
- HEX
- #ffd800
- RGB
- rgb(255 216 0)
- HSL
- hsl(51 100% 50%)
- HWB
- hwb(51 0% 0%)
- OKLCH
- oklch(0.889 0.183 95.8)
- OKLab
- oklab(0.889 -0.018 0.182)
- CIE Lab
- lab(87.72 2.43 86.72)
- LCH
- lch(87.72 86.75 88.4)
- CMYK
- cmyk(0% 15% 100% 0%)
Tints · Shades · Tones
Tints
- FFDC45
- FFE164
- FFE57D
- FFE992
- FFEDA6
- FFF1B9
- FFF5CB
- FFF8DD
- FFFCEE
Shades
- DEBC00
- BEA000
- 9E8500
- 806B00
- 635300
- 483B00
- 2E2500
- 161100
- 030200
Tones
- F2CF32
- E4C646
- D7BE54
- CAB55F
- BDAC67
- B1A36E
- A49B74
- 989279
- 8C897D
Color harmonies
Complementary +180°
- FFD800
School Bus
- D0D8FF
≈ Icy Plains
Analogous -30° +30°
- FFD800
School Bus
- FFD1A3
≈ Affinity
- BDEF5A
≈ Green Cow
Triadic +120° +240°
- FFD800
School Bus
- 95E9FF
≈ Winter Wizard
- FFC6F0
≈ Rosy Maple Moth
Split-complementary +150° +210°
- FFD800
School Bus
- BCDFFF
≈ Dithered Sky
- E5CFFF
≈ Lens Flare Pink
Tetradic +90° +180° +270°
- FFD800
School Bus
- 00FBE9
≈ Bright Aqua
- D0D8FF
≈ Icy Plains
- FFCAD4
≈ Sweet Sixteen
Contrast & accessibility
Ag
FailOn white
WCAG 1.39:1 · APCA Lc 19
Ag
AAAOn black
WCAG 15.07:1 · APCA Lc 85
Best text color: #000000
WCAG 15.07:1 (AAA) · APCA Lc 85
Contrast pairs
Code snippets
CSS
:root {
--school-bus: #ffd800;
--school-bus-rgb: 255 216 0;
--school-bus-oklch: oklch(0.889 0.183 95.8);
}
.element {
color: var(--school-bus);
background-color: hsl(51 100% 50%);
border-color: oklch(0.889 0.183 95.8);
}Tailwind CSS v4
@theme {
--color-school-bus: #ffd800;
--color-school-bus-50: #fff6ba;
--color-school-bus-100: #f8e9a2;
--color-school-bus-200: #e9d575;
--color-school-bus-300: #d1b732;
--color-school-bus-400: #bf9b00;
--color-school-bus-500: #ab8000;
--color-school-bus-600: #916d00;
--color-school-bus-700: #745700;
--color-school-bus-800: #583f00;
--color-school-bus-900: #3d2b00;
--color-school-bus-950: #271800;
}SCSS
$school-bus: #ffd800;
$school-bus-rgb: 255, 216, 0;
$school-bus-light: mix(#fff, $school-bus, 20%);
$school-bus-dark: mix(#000, $school-bus, 20%);
.element {
color: $school-bus;
box-shadow: 0 0 0 2px rgba($school-bus, 0.35);
}