Benannte Farbe · #A78A50
Graceful Gazelle
Graceful Gazelle ist #A78A50: rgb(167 138 80), hsl(40 35% 48%), oklch(0.647 0.084 83.5). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Orange mean? → · Graceful Gazelle color name →
#A78A50
oklch(0.647 0.084 83.5)
Farbumrechnungen
- HEX
- #a78a50
- RGB
- rgb(167 138 80)
- HSL
- hsl(40 35% 48%)
- HWB
- hwb(40 31% 35%)
- OKLCH
- oklch(0.647 0.084 83.5)
- OKLab
- oklab(0.647 0.009 0.084)
- CIE Lab
- lab(59.25 5.88 35.14)
- LCH
- lch(59.25 35.63 80.5)
- CMYK
- cmyk(0% 17% 52% 35%)
Tints · Shades · Tones
Tints
- B09562
- B8A173
- C1AC85
- CAB896
- D2C4A7
- DBCFB8
- E4DBCA
- EDE7DB
- F6F3ED
Shades
- 917744
- 7B6539
- 66532E
- 524224
- 3E321A
- 2C2210
- 1A1407
- 0A0702
- 010100
Tones
- A38956
- 9F885C
- 9B8761
- 978666
- 94856B
- 90846F
- 8C8374
- 888278
- 84817C
Farbharmonien
Komplementär +180°
- A78A50
Graceful Gazelle
- 748EC2
≈ Dayflower Blue
Analog -30° +30°
- A78A50
Graceful Gazelle
- B7805D
≈ Pastry Shell
- 8E9457
≈ Topiary
Triadisch +120° +240°
- A78A50
Graceful Gazelle
- 469DA6
≈ Caribbean Cruise
- A87DAC
≈ Heart Potion
Geteilt komplementär +150° +210°
- A78A50
Graceful Gazelle
- 5797BA
≈ Hush-A-Bye
- 9185BD
≈ Heliotropic Mauve
Tetradisch +90° +180° +270°
- A78A50
Graceful Gazelle
- 529F8A
≈ Derby Green
- 748EC2
≈ Dayflower Blue
- B77992
≈ Choral Singer
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.28:1 · APCA Lc 60
Ag
AAAuf Schwarz
WCAG 6.39:1 · APCA Lc 42
Beste Textfarbe: #000000
WCAG 6.39:1 (AA) · APCA Lc 42
Contrast pairs
Code-Snippets
CSS
:root {
--graceful-gazelle: #a78a50;
--graceful-gazelle-rgb: 167 138 80;
--graceful-gazelle-oklch: oklch(0.647 0.084 83.5);
}
.element {
color: var(--graceful-gazelle);
background-color: hsl(40 35% 48%);
border-color: oklch(0.647 0.084 83.5);
}Tailwind CSS v4
@theme {
--color-graceful-gazelle: #a78a50;
--color-graceful-gazelle-50: #fff4db;
--color-graceful-gazelle-100: #f5e6c9;
--color-graceful-gazelle-200: #e5d2ac;
--color-graceful-gazelle-300: #cbb586;
--color-graceful-gazelle-400: #b69a63;
--color-graceful-gazelle-500: #a18140;
--color-graceful-gazelle-600: #886d37;
--color-graceful-gazelle-700: #6d572c;
--color-graceful-gazelle-800: #513f1e;
--color-graceful-gazelle-900: #382c14;
--color-graceful-gazelle-950: #231906;
}SCSS
$graceful-gazelle: #a78a50;
$graceful-gazelle-rgb: 167, 138, 80;
$graceful-gazelle-light: mix(#fff, $graceful-gazelle, 20%);
$graceful-gazelle-dark: mix(#000, $graceful-gazelle, 20%);
.element {
color: $graceful-gazelle;
box-shadow: 0 0 0 2px rgba($graceful-gazelle, 0.35);
}