Benannte Farbe · #F5BC1D
Golden Lock
Golden Lock ist #F5BC1D: rgb(245 188 29), hsl(44 92% 54%), oklch(0.825 0.164 85.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Golden Lock color name →
#F5BC1D
oklch(0.825 0.164 85.6)
Farbumrechnungen
- HEX
- #f5bc1d
- RGB
- rgb(245 188 29)
- HSL
- hsl(44 92% 54%)
- HWB
- hwb(44 11% 4%)
- OKLCH
- oklch(0.825 0.164 85.6)
- OKLab
- oklab(0.825 0.013 0.163)
- CIE Lab
- lab(79.86 12.13 77.27)
- LCH
- lch(79.86 78.22 81.1)
- CMYK
- cmyk(0% 23% 88% 4%)
Tints · Shades · Tones
Tints
- F6C348
- F7CA63
- F9D17B
- FAD890
- FBDFA3
- FCE5B6
- FDECC9
- FDF2DB
- FEF9ED
Shades
- D5A318
- B68B13
- 98730E
- 7B5D09
- 5F4705
- 443203
- 2B1F01
- 150D00
- 030200
Tones
- E9B638
- DDB048
- D1AB54
- C5A55D
- B99F65
- AE996C
- A29372
- 978D77
- 8B867C
Farbharmonien
Komplementär +180°
- F5BC1D
Golden Lock
- ABC5FF
≈ Night Snow
Analog -30° +30°
- F5BC1D
Golden Lock
- FFB27B
≈ Isn’t It Just Peachy
- C2D242
≈ Grunervetliner
Triadisch +120° +240°
- F5BC1D
Golden Lock
- 00DFF2
≈ Tamarama
- FB9EFF
≈ Pinkalicious
Geteilt komplementär +150° +210°
- F5BC1D
Golden Lock
- 81D0FF
≈ Drift on the Sea
- CAB9FF
≈ Lavender Tonic
Tetradisch +90° +180° +270°
- F5BC1D
Golden Lock
- 00E5C1
≈ Aquamarine
- ABC5FF
≈ Night Snow
- FFA7C8
≈ Taffy Pink
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 1.73:1 · APCA Lc 31
Ag
AAAAuf Schwarz
WCAG 12.09:1 · APCA Lc 71
Beste Textfarbe: #000000
WCAG 12.09:1 (AAA) · APCA Lc 71
Contrast pairs
Code-Snippets
CSS
:root {
--golden-lock: #f5bc1d;
--golden-lock-rgb: 245 188 29;
--golden-lock-oklch: oklch(0.825 0.164 85.6);
}
.element {
color: var(--golden-lock);
background-color: hsl(44 92% 54%);
border-color: oklch(0.825 0.164 85.6);
}Tailwind CSS v4
@theme {
--color-golden-lock: #f5bc1d;
--color-golden-lock-50: #fff3c0;
--color-golden-lock-100: #ffe5a9;
--color-golden-lock-200: #f2d080;
--color-golden-lock-300: #dbb248;
--color-golden-lock-400: #c99500;
--color-golden-lock-500: #b67900;
--color-golden-lock-600: #9a6700;
--color-golden-lock-700: #7b5200;
--color-golden-lock-800: #5d3b00;
--color-golden-lock-900: #412900;
--color-golden-lock-950: #2a1600;
}SCSS
$golden-lock: #f5bc1d;
$golden-lock-rgb: 245, 188, 29;
$golden-lock-light: mix(#fff, $golden-lock, 20%);
$golden-lock-dark: mix(#000, $golden-lock, 20%);
.element {
color: $golden-lock;
box-shadow: 0 0 0 2px rgba($golden-lock, 0.35);
}