Nächste benannte Farbe · #6E7C43
#6E7C43
Nächste benannte Farbe: Grasshopper
#6E7C43 (rgb(110 124 67), hsl(75 30% 37%), oklch(0.561 0.082 120.4)) liegt am nächsten an der benannten Farbe Grasshopper. Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
#6E7C43
oklch(0.561 0.082 120.4)
Farbumrechnungen
- HEX
- #6e7c43
- RGB
- rgb(110 124 67)
- HSL
- hsl(75 30% 37%)
- HWB
- hwb(75 26% 51%)
- OKLCH
- oklch(0.561 0.082 120.4)
- OKLab
- oklab(0.561 -0.042 0.071)
- CIE Lab
- lab(49.81 -12.59 29.15)
- LCH
- lch(49.81 31.75 113.4)
- CMYK
- cmyk(11% 0% 46% 51%)
Tints · Shades · Tones
Tints
- 7B8955
- 899568
- 97A27A
- A5AF8C
- B4BC9F
- C2C9B2
- D1D6C5
- E0E4D8
- EFF1EB
Shades
- 5F6B39
- 505A2F
- 414A26
- 333B1D
- 262C14
- 191E0C
- 0E1105
- 040501
- 010100
Tones
- 707D4A
- 717D51
- 737E57
- 757E5D
- 777E63
- 797F69
- 7A7F6F
- 7C7F75
- 7E807A
Farbharmonien
Komplementär +180°
- 6E7C43
Grasshopper
- 7C699E
≈ Purple Paradise
Analog -30° +30°
- 6E7C43
Grasshopper
- 877338
≈ Mustard Magic
- 4F825B
≈ Leisure Green
Triadisch +120° +240°
- 6E7C43
Grasshopper
- 457BA0
≈ Zenith
- 9C6072
≈ Tropical Hibiscus
Geteilt komplementär +150° +210°
- 6E7C43
Grasshopper
- 6272A5
≈ King’s Robe
- 90638B
≈ Hashita Purple
Tetradisch +90° +180° +270°
- 6E7C43
Grasshopper
- 2C8290
≈ Sea Bed
- 7C699E
≈ Purple Paradise
- 9F6257
≈ Savannah Red
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 4.53:1 · APCA Lc 71
Ag
AAAuf Schwarz
WCAG 4.62:1 · APCA Lc 30
Beste Textfarbe: #000000
WCAG 4.62:1 (AA) · APCA Lc 30
Contrast pairs
Code-Snippets
CSS
:root {
--grasshopper: #6e7c43;
--grasshopper-rgb: 110 124 67;
--grasshopper-oklch: oklch(0.561 0.082 120.4);
}
.element {
color: var(--grasshopper);
background-color: hsl(75 30% 37%);
border-color: oklch(0.561 0.082 120.4);
}Tailwind CSS v4
@theme {
--color-grasshopper: #6e7c43;
--color-grasshopper-50: #f1f9e0;
--color-grasshopper-100: #e3edcf;
--color-grasshopper-200: #cedab4;
--color-grasshopper-300: #b0bf90;
--color-grasshopper-400: #98a66f;
--color-grasshopper-500: #7f8e4e;
--color-grasshopper-600: #6b7843;
--color-grasshopper-700: #566035;
--color-grasshopper-800: #3f4625;
--color-grasshopper-900: #2c3118;
--color-grasshopper-950: #191d09;
}SCSS
$grasshopper: #6e7c43;
$grasshopper-rgb: 110, 124, 67;
$grasshopper-light: mix(#fff, $grasshopper, 20%);
$grasshopper-dark: mix(#000, $grasshopper, 20%);
.element {
color: $grasshopper;
box-shadow: 0 0 0 2px rgba($grasshopper, 0.35);
}