Benannte Farbe · #FFF39A
Goldilocks
Goldilocks ist #FFF39A: rgb(255 243 154), hsl(53 100% 80%), oklch(0.954 0.11 101.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Goldilocks color name →
#FFF39A
oklch(0.954 0.11 101.6)
Farbumrechnungen
- HEX
- #fff39a
- RGB
- rgb(255 243 154)
- HSL
- hsl(53 100% 80%)
- HWB
- hwb(53 60% 0%)
- OKLCH
- oklch(0.954 0.11 101.6)
- OKLab
- oklab(0.954 -0.022 0.108)
- CIE Lab
- lab(95.35 -4.84 44.38)
- LCH
- lch(95.35 44.65 96.2)
- CMYK
- cmyk(0% 5% 40% 0%)
Tints · Shades · Tones
Tints
- FFF4A5
- FFF6B0
- FFF7BB
- FFF8C5
- FFFACF
- FFFBD9
- FFFCE3
- FFFDEC
- FFFEF6
Shades
- DED385
- BEB471
- 9E975E
- 807A4B
- 635E39
- 484427
- 2E2B17
- 161409
- 030301
Tones
- F2E798
- E4DB97
- D7CF94
- CAC492
- BDB890
- B1AD8D
- A4A18A
- 989687
- 8C8B84
Farbharmonien
Komplementär +180°
- FFF39A
Goldilocks
- EDEFFF
≈ Carte Blanche
Analog -30° +30°
- FFF39A
Goldilocks
- FFEDD8
≈ Sand Crystal
- D7FFB7
≈ Greedy Green
Triadisch +120° +240°
- FFF39A
Goldilocks
- DAF5FF
≈ Glacial Day
- FFE9F6
≈ Dolomite Crystal
Geteilt komplementär +150° +210°
- FFF39A
Goldilocks
- E5F1FF
≈ Cotton Boll
- F7EBFF
≈ Placebo Fuchsia
Tetradisch +90° +180° +270°
- FFF39A
Goldilocks
- BCFFFB
≈ The Big Freeze
- EDEFFF
≈ Carte Blanche
- FFEAEC
≈ Pink Lemonade
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.13:1 · APCA Lc 0
Ag
AAAAuf Schwarz
WCAG 18.53:1 · APCA Lc 99
Beste Textfarbe: #000000
WCAG 18.53:1 (AAA) · APCA Lc 99
Contrast pairs
Code-Snippets
CSS
:root {
--goldilocks: #fff39a;
--goldilocks-rgb: 255 243 154;
--goldilocks-oklch: oklch(0.954 0.11 101.6);
}
.element {
color: var(--goldilocks);
background-color: hsl(53 100% 80%);
border-color: oklch(0.954 0.11 101.6);
}Tailwind CSS v4
@theme {
--color-goldilocks: #fff39a;
--color-goldilocks-50: #faf7d3;
--color-goldilocks-100: #eeeac0;
--color-goldilocks-200: #dcd7a0;
--color-goldilocks-300: #c1ba77;
--color-goldilocks-400: #aca14e;
--color-goldilocks-500: #96881b;
--color-goldilocks-600: #7e731b;
--color-goldilocks-700: #655c15;
--color-goldilocks-800: #4c430c;
--color-goldilocks-900: #352e07;
--color-goldilocks-950: #201b00;
}SCSS
$goldilocks: #fff39a;
$goldilocks-rgb: 255, 243, 154;
$goldilocks-light: mix(#fff, $goldilocks, 20%);
$goldilocks-dark: mix(#000, $goldilocks, 20%);
.element {
color: $goldilocks;
box-shadow: 0 0 0 2px rgba($goldilocks, 0.35);
}