Benannte Farbe · #F0D39D
Sunbeam Yellow
Sunbeam Yellow ist #F0D39D: rgb(240 211 157), hsl(39 73% 78%), oklch(0.878 0.077 82.7). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Sunbeam Yellow color name →
#F0D39D
oklch(0.878 0.077 82.7)
Farbumrechnungen
- HEX
- #f0d39d
- RGB
- rgb(240 211 157)
- HSL
- hsl(39 73% 78%)
- HWB
- hwb(39 62% 6%)
- OKLCH
- oklch(0.878 0.077 82.7)
- OKLab
- oklab(0.878 0.01 0.076)
- CIE Lab
- lab(86.07 4.89 30.72)
- LCH
- lch(86.07 31.11 81)
- CMYK
- cmyk(0% 12% 35% 6%)
Tints · Shades · Tones
Tints
- F2D7A7
- F3DCB1
- F5E0BB
- F6E5C5
- F8E9CF
- F9EED8
- FBF2E2
- FCF6EC
- FEFBF5
Shades
- D1B788
- B29C73
- 95825F
- 78694C
- 5D513A
- 433A28
- 2A2418
- 141009
- 030201
Tones
- E4CA9B
- D9C298
- CDBA95
- C2B192
- B7A990
- ABA18D
- A0988A
- 959087
- 8B8883
Farbharmonien
Komplementär +180°
- F0D39D
Sunbeam Yellow
- C3D8FF
≈ Pale Phthalo Blue
Analog -30° +30°
- F0D39D
Sunbeam Yellow
- FFCAAA
≈ Peachy Pico
- D7DDA2
≈ Burgundy Grey
Triadisch +120° +240°
- F0D39D
Sunbeam Yellow
- 99E7ED
≈ Blizzard Blue
- F0C7F5
≈ Purple’s Baby Sister
Geteilt komplementär +150° +210°
- F0D39D
Sunbeam Yellow
- A8E0FF
≈ Droplet
- D8D0FF
≈ Pale Lavender
Tetradisch +90° +180° +270°
- F0D39D
Sunbeam Yellow
- A2E8D2
≈ Sweet Aqua
- C3D8FF
≈ Pale Phthalo Blue
- FFC3DB
≈ Sweet Romance
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.44:1 · APCA Lc 21
Ag
AAAAuf Schwarz
WCAG 14.50:1 · APCA Lc 82
Beste Textfarbe: #000000
WCAG 14.50:1 (AAA) · APCA Lc 82
Contrast pairs
Code-Snippets
CSS
:root {
--sunbeam-yellow: #f0d39d;
--sunbeam-yellow-rgb: 240 211 157;
--sunbeam-yellow-oklch: oklch(0.878 0.077 82.7);
}
.element {
color: var(--sunbeam-yellow);
background-color: hsl(39 73% 78%);
border-color: oklch(0.878 0.077 82.7);
}Tailwind CSS v4
@theme {
--color-sunbeam-yellow: #f0d39d;
--color-sunbeam-yellow-50: #fff4dd;
--color-sunbeam-yellow-100: #f4e6cc;
--color-sunbeam-yellow-200: #e4d2b0;
--color-sunbeam-yellow-300: #cab58b;
--color-sunbeam-yellow-400: #b59b69;
--color-sunbeam-yellow-500: #9f8148;
--color-sunbeam-yellow-600: #866e3d;
--color-sunbeam-yellow-700: #6c5831;
--color-sunbeam-yellow-800: #504022;
--color-sunbeam-yellow-900: #382c16;
--color-sunbeam-yellow-950: #221908;
}SCSS
$sunbeam-yellow: #f0d39d;
$sunbeam-yellow-rgb: 240, 211, 157;
$sunbeam-yellow-light: mix(#fff, $sunbeam-yellow, 20%);
$sunbeam-yellow-dark: mix(#000, $sunbeam-yellow, 20%);
.element {
color: $sunbeam-yellow;
box-shadow: 0 0 0 2px rgba($sunbeam-yellow, 0.35);
}