Benannte Farbe · #F9B500
Yellow Summer
Yellow Summer ist #F9B500: rgb(249 181 0), hsl(44 100% 49%), oklch(0.815 0.168 81.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Yellow Summer color name →
#F9B500
oklch(0.815 0.168 81.3)
Farbumrechnungen
- HEX
- #f9b500
- RGB
- rgb(249 181 0)
- HSL
- hsl(44 100% 49%)
- HWB
- hwb(44 0% 2%)
- OKLCH
- oklch(0.815 0.168 81.3)
- OKLab
- oklab(0.815 0.026 0.166)
- CIE Lab
- lab(78.58 17.06 80.5)
- LCH
- lch(78.58 82.29 78)
- CMYK
- cmyk(0% 27% 100% 2%)
Tints · Shades · Tones
Tints
- FABD40
- FBC55E
- FCCC76
- FDD48C
- FDDBA0
- FEE3B4
- FEEAC7
- FFF1DA
- FFF8ED
Shades
- D99D00
- B98600
- 9A6F00
- 7D5900
- 614400
- 463000
- 2C1D00
- 150C00
- 030200
Tones
- EDB02E
- E0AB41
- D4A64F
- C8A15A
- BC9C62
- AF966A
- A49171
- 988B76
- 8C867B
Farbharmonien
Komplementär +180°
- F9B500
Yellow Summer
- A1C3FF
≈ Pastel Blue
Analog -30° +30°
- F9B500
Yellow Summer
- FFAC7B
≈ Larch Bolete
- C7CC2C
≈ Yellow-Green Grosbeak
Triadisch +120° +240°
- F9B500
Yellow Summer
- 00DCE8
≈ Tamarama
- F09FFF
≈ Party Pig
Geteilt komplementär +150° +210°
- F9B500
Yellow Summer
- 6DD0FF
≈ Bubbly Barracuda
- C3B7FF
≈ Dried Lilac
Tetradisch +90° +180° +270°
- F9B500
Yellow Summer
- 00E3B5
≈ Lifeless Green
- A1C3FF
≈ Pastel Blue
- FFA1CC
≈ Bazooka Pink
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.80:1 · APCA Lc 33
Ag
AAAAuf Schwarz
WCAG 11.63:1 · APCA Lc 69
Beste Textfarbe: #000000
WCAG 11.63:1 (AAA) · APCA Lc 69
Contrast pairs
Code-Snippets
CSS
:root {
--yellow-summer: #f9b500;
--yellow-summer-rgb: 249 181 0;
--yellow-summer-oklch: oklch(0.815 0.168 81.3);
}
.element {
color: var(--yellow-summer);
background-color: hsl(44 100% 49%);
border-color: oklch(0.815 0.168 81.3);
}Tailwind CSS v4
@theme {
--color-yellow-summer: #f9b500;
--color-yellow-summer-50: #fff2bf;
--color-yellow-summer-100: #ffe4a7;
--color-yellow-summer-200: #f7ce7e;
--color-yellow-summer-300: #e1af43;
--color-yellow-summer-400: #d09100;
--color-yellow-summer-500: #bd7500;
--color-yellow-summer-600: #a06300;
--color-yellow-summer-700: #804f00;
--color-yellow-summer-800: #603900;
--color-yellow-summer-900: #442700;
--color-yellow-summer-950: #2c1500;
}SCSS
$yellow-summer: #f9b500;
$yellow-summer-rgb: 249, 181, 0;
$yellow-summer-light: mix(#fff, $yellow-summer, 20%);
$yellow-summer-dark: mix(#000, $yellow-summer, 20%);
.element {
color: $yellow-summer;
box-shadow: 0 0 0 2px rgba($yellow-summer, 0.35);
}