Benannte Farbe · #7D7640
Steppe Green
Steppe Green ist #7D7640: rgb(125 118 64), hsl(53 32% 37%), oklch(0.559 0.075 101.9). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Yellow mean? → · Steppe Green color name →
#7D7640
oklch(0.559 0.075 101.9)
Farbumrechnungen
- HEX
- #7d7640
- RGB
- rgb(125 118 64)
- HSL
- hsl(53 32% 37%)
- HWB
- hwb(53 25% 51%)
- OKLCH
- oklch(0.559 0.075 101.9)
- OKLab
- oklab(0.559 -0.015 0.073)
- CIE Lab
- lab(49.33 -3.14 30.54)
- LCH
- lch(49.33 30.7 95.9)
- CMYK
- cmyk(0% 6% 49% 51%)
Tints · Shades · Tones
Tints
- 898353
- 959065
- A29D78
- AFAB8B
- BCB99D
- C9C6B1
- D6D4C4
- E4E2D7
- F1F1EB
Shades
- 6C6636
- 5B562D
- 4B4724
- 3B381B
- 2C2913
- 1E1C0B
- 110F05
- 050501
- 010100
Tones
- 7D7747
- 7D784E
- 7E7955
- 7E7A5C
- 7E7B62
- 7F7C68
- 7F7D6E
- 7F7E74
- 807F7A
Farbharmonien
Komplementär +180°
- 7D7640
Steppe Green
- 6D6F9F
≈ Thirsty Thursday
Analog -30° +30°
- 7D7640
Steppe Green
- 906D41
≈ Olde World Gold
- 647E4F
≈ Green Knoll
Triadisch +120° +240°
- 7D7640
Steppe Green
- 3C7E94
≈ Blue Rodeo
- 936381
≈ Rust Magenta
Geteilt komplementär +150° +210°
- 7D7640
Steppe Green
- 53779F
≈ Secrecy
- 836894
≈ Dark Lavender
Tetradisch +90° +180° +270°
- 7D7640
Steppe Green
- 36827F
≈ Amazon Drift
- 6D6F9F
≈ Thirsty Thursday
- 9B6269
≈ Soft Bromeliad
Kontrast & Barrierefreiheit
Ag
AAAuf Weiß
WCAG 4.62:1 · APCA Lc 72
Ag
AAAuf Schwarz
WCAG 4.53:1 · APCA Lc 30
Beste Textfarbe: #FFFFFF
WCAG 4.62:1 (AA) · APCA Lc 72
Contrast pairs
Code-Snippets
CSS
:root {
--steppe-green: #7d7640;
--steppe-green-rgb: 125 118 64;
--steppe-green-oklch: oklch(0.559 0.075 101.9);
}
.element {
color: var(--steppe-green);
background-color: hsl(53 32% 37%);
border-color: oklch(0.559 0.075 101.9);
}Tailwind CSS v4
@theme {
--color-steppe-green: #7d7640;
--color-steppe-green-50: #f8f7de;
--color-steppe-green-100: #eceacd;
--color-steppe-green-200: #d9d6b2;
--color-steppe-green-300: #bdba8e;
--color-steppe-green-400: #a7a06c;
--color-steppe-green-500: #90884b;
--color-steppe-green-600: #7a7340;
--color-steppe-green-700: #615c33;
--color-steppe-green-800: #484323;
--color-steppe-green-900: #322e18;
--color-steppe-green-950: #1e1b08;
}SCSS
$steppe-green: #7d7640;
$steppe-green-rgb: 125, 118, 64;
$steppe-green-light: mix(#fff, $steppe-green, 20%);
$steppe-green-dark: mix(#000, $steppe-green, 20%);
.element {
color: $steppe-green;
box-shadow: 0 0 0 2px rgba($steppe-green, 0.35);
}