Benannte Farbe · #57605A
Jasper Green
Jasper Green ist #57605A: rgb(87 96 90), hsl(140 5% 36%), oklch(0.479 0.015 156.6). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Jasper Green color name →
#57605A
oklch(0.479 0.015 156.6)
Farbumrechnungen
- HEX
- #57605a
- RGB
- rgb(87 96 90)
- HSL
- hsl(140 5% 36%)
- HWB
- hwb(140 34% 62%)
- OKLCH
- oklch(0.479 0.015 156.6)
- OKLab
- oklab(0.479 -0.013 0.006)
- CIE Lab
- lab(39.79 -4.6 2.18)
- LCH
- lch(39.79 5.1 154.6)
- CMYK
- cmyk(9% 0% 6% 62%)
Tints · Shades · Tones
Tints
- 666F69
- 767D78
- 868D88
- 969C98
- A7ACA9
- B8BCB9
- C9CDCA
- DBDDDC
- EDEEED
Shades
- 4B524D
- 3E4541
- 333835
- 272C29
- 1C201E
- 121513
- 080A09
- 030303
- 000000
Tones
- 5B635E
- 5F6661
- 636965
- 676D69
- 6B706D
- 6F7371
- 737674
- 787978
- 7C7D7C
Farbharmonien
Komplementär +180°
- 57605A
Jasper Green
- 635A60
≈ Mauve Brown
Analog -30° +30°
- 57605A
Jasper Green
- 5B5F56
≈ Sable Evening
- 55605F
≈ Stream Bed
Triadisch +120° +240°
- 57605A
Jasper Green
- 5B5D66
≈ Blue Slate
- 655B58
≈ Solid Empire
Geteilt komplementär +150° +210°
- 57605A
Jasper Green
- 5F5B64
≈ Baroque Grey
- 655A5C
≈ Roasted Black
Tetradisch +90° +180° +270°
- 57605A
Jasper Green
- 575E65
≈ Lava Rock
- 635A60
≈ Mauve Brown
- 635C55
≈ Boycott
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 6.50:1 · APCA Lc 82
Ag
FailAuf Schwarz
WCAG 3.22:1 · APCA Lc 20
Beste Textfarbe: #FFFFFF
WCAG 6.50:1 (AA) · APCA Lc 82
Contrast pairs
Code-Snippets
CSS
:root {
--jasper-green: #57605a;
--jasper-green-rgb: 87 96 90;
--jasper-green-oklch: oklch(0.479 0.015 156.6);
}
.element {
color: var(--jasper-green);
background-color: hsl(140 5% 36%);
border-color: oklch(0.479 0.015 156.6);
}Tailwind CSS v4
@theme {
--color-jasper-green: #57605a;
--color-jasper-green-50: #f2f6f3;
--color-jasper-green-100: #e4e9e6;
--color-jasper-green-200: #cfd6d2;
--color-jasper-green-300: #b1bab5;
--color-jasper-green-400: #98a19b;
--color-jasper-green-500: #7f8982;
--color-jasper-green-600: #6b746e;
--color-jasper-green-700: #565d58;
--color-jasper-green-800: #3f4440;
--color-jasper-green-900: #2b2f2c;
--color-jasper-green-950: #181b19;
}SCSS
$jasper-green: #57605a;
$jasper-green-rgb: 87, 96, 90;
$jasper-green-light: mix(#fff, $jasper-green, 20%);
$jasper-green-dark: mix(#000, $jasper-green, 20%);
.element {
color: $jasper-green;
box-shadow: 0 0 0 2px rgba($jasper-green, 0.35);
}