Benannte Farbe · #685D4A
Hannover Hills
Hannover Hills ist #685D4A: rgb(104 93 74), hsl(38 17% 35%), oklch(0.483 0.032 81.3). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Hannover Hills color name →
#685D4A
oklch(0.483 0.032 81.3)
Farbumrechnungen
- HEX
- #685d4a
- RGB
- rgb(104 93 74)
- HSL
- hsl(38 17% 35%)
- HWB
- hwb(38 29% 59%)
- OKLCH
- oklch(0.483 0.032 81.3)
- OKLab
- oklab(0.483 0.005 0.032)
- CIE Lab
- lab(40.15 2.16 12.66)
- LCH
- lch(40.15 12.85 80.3)
- CMYK
- cmyk(0% 11% 29% 59%)
Tints · Shades · Tones
Tints
- 766C5A
- 847B6B
- 938B7D
- A29A8E
- B1ABA0
- C0BBB3
- CFCCC5
- DFDCD8
- EFEEEB
Shades
- 59503F
- 4B4335
- 3E372A
- 302A20
- 241F17
- 18140E
- 0C0A06
- 040302
- 000000
Tones
- 6A604F
- 6D6455
- 6F675A
- 726B5F
- 746E65
- 76726A
- 797570
- 7B7975
- 7E7C7B
Farbharmonien
Komplementär +180°
- 685D4A
Hannover Hills
- 545F71
≈ Da Blues
Analog -30° +30°
- 685D4A
Hannover Hills
- 6E5A4E
≈ Coffee House
- 5F614C
≈ Old Botanical Garden
Triadisch +120° +240°
- 685D4A
Hannover Hills
- 496466
≈ Walk Me Home
- 67596A
≈ Olivine Basalt
Geteilt komplementär +150° +210°
- 685D4A
Hannover Hills
- 4C626E
≈ Trekking Blue
- 5E5C70
≈ Luscious Purple
Tetradisch +90° +180° +270°
- 685D4A
Hannover Hills
- 4C655C
≈ Jasper Park
- 545F71
≈ Da Blues
- 6E5761
≈ Aubergine Grey
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.45:1 · APCA Lc 82
Ag
FailAuf Schwarz
WCAG 3.25:1 · APCA Lc 20
Beste Textfarbe: #FFFFFF
WCAG 6.45:1 (AA) · APCA Lc 82
Contrast pairs
Code-Snippets
CSS
:root {
--hannover-hills: #685d4a;
--hannover-hills-rgb: 104 93 74;
--hannover-hills-oklch: oklch(0.483 0.032 81.3);
}
.element {
color: var(--hannover-hills);
background-color: hsl(38 17% 35%);
border-color: oklch(0.483 0.032 81.3);
}Tailwind CSS v4
@theme {
--color-hannover-hills: #685d4a;
--color-hannover-hills-50: #faf5eb;
--color-hannover-hills-100: #ede7dc;
--color-hannover-hills-200: #dbd3c5;
--color-hannover-hills-300: #bfb6a5;
--color-hannover-hills-400: #a89d89;
--color-hannover-hills-500: #91846e;
--color-hannover-hills-600: #7b705e;
--color-hannover-hills-700: #625a4b;
--color-hannover-hills-800: #484136;
--color-hannover-hills-900: #322d25;
--color-hannover-hills-950: #1e1a13;
}SCSS
$hannover-hills: #685d4a;
$hannover-hills-rgb: 104, 93, 74;
$hannover-hills-light: mix(#fff, $hannover-hills, 20%);
$hannover-hills-dark: mix(#000, $hannover-hills, 20%);
.element {
color: $hannover-hills;
box-shadow: 0 0 0 2px rgba($hannover-hills, 0.35);
}