Nazwany kolor · #FFF39A
Goldilocks
Goldilocks to #FFF39A: rgb(255 243 154), hsl(53 100% 80%), oklch(0.954 0.11 101.6). Zobacz odcienie jaśniejsze i ciemniejsze, harmonie, kontrast WCAG i APCA oraz kod CSS, Tailwind v4 i SCSS.
What does Yellow mean? → · Goldilocks color name →
#FFF39A
oklch(0.954 0.11 101.6)
Konwersje koloru
- 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%)
Odcienie jaśniejsze · Odcienie ciemniejsze · Tony
Odcienie jaśniejsze
- FFF4A5
- FFF6B0
- FFF7BB
- FFF8C5
- FFFACF
- FFFBD9
- FFFCE3
- FFFDEC
- FFFEF6
Odcienie ciemniejsze
- DED385
- BEB471
- 9E975E
- 807A4B
- 635E39
- 484427
- 2E2B17
- 161409
- 030301
Tony
- F2E798
- E4DB97
- D7CF94
- CAC492
- BDB890
- B1AD8D
- A4A18A
- 989687
- 8C8B84
Harmonie kolorów
Komplementarna +180°
- FFF39A
Goldilocks
- EDEFFF
≈ Carte Blanche
Analogowa -30° +30°
- FFF39A
Goldilocks
- FFEDD8
≈ Sand Crystal
- D7FFB7
≈ Greedy Green
Triada +120° +240°
- FFF39A
Goldilocks
- DAF5FF
≈ Glacial Day
- FFE9F6
≈ Dolomite Crystal
Komplementarna rozszczepiona +150° +210°
- FFF39A
Goldilocks
- E5F1FF
≈ Cotton Boll
- F7EBFF
≈ Placebo Fuchsia
Tetrada +90° +180° +270°
- FFF39A
Goldilocks
- BCFFFB
≈ The Big Freeze
- EDEFFF
≈ Carte Blanche
- FFEAEC
≈ Pink Lemonade
Kontrast i dostępność
Ag
FailNa bieli
WCAG 1.13:1 · APCA Lc 0
Ag
AAANa czerni
WCAG 18.53:1 · APCA Lc 99
Najlepszy kolor tekstu: #000000
WCAG 18.53:1 (AAA) · APCA Lc 99
Contrast pairs
Fragmenty kodu
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);
}