Benannte Farbe · #838A7A
Spruce Shadow
Spruce Shadow ist #838A7A: rgb(131 138 122), hsl(86 6% 51%), oklch(0.623 0.025 126.4). Mit Tints, Shades, Harmonien, WCAG- & APCA-Kontrast sowie CSS-, Tailwind-v4- und SCSS-Code.
What does Gray mean? → · Spruce Shadow color name →
#838A7A
oklch(0.623 0.025 126.4)
Farbumrechnungen
- HEX
- #838a7a
- RGB
- rgb(131 138 122)
- HSL
- hsl(86 6% 51%)
- HWB
- hwb(86 48% 46%)
- OKLCH
- oklch(0.623 0.025 126.4)
- OKLab
- oklab(0.623 -0.015 0.02)
- CIE Lab
- lab(56.54 -4.97 7.68)
- LCH
- lch(56.54 9.15 122.9)
- CMYK
- cmyk(5% 0% 12% 46%)
Tints · Shades · Tones
Tints
- 8F9587
- 9BA093
- A7ACA0
- B3B7AD
- BFC3BA
- CCCFC8
- D8DBD5
- E5E7E3
- F2F3F1
Shades
- 717769
- 606559
- 4F5349
- 3F423A
- 2F322B
- 20221D
- 121410
- 060705
- 010101
Tones
- 83897B
- 82887B
- 82877C
- 82867C
- 82857D
- 81847E
- 81837E
- 81827F
- 80817F
Farbharmonien
Komplementär +180°
- 838A7A
Spruce Shadow
- 8B8393
≈ Purple Ash
Analog -30° +30°
- 838A7A
Spruce Shadow
- 8B8777
≈ Kosher Khaki
- 7B8C81
≈ Salty Sea
Triadisch +120° +240°
- 838A7A
Spruce Shadow
- 7B8996
≈ Spartan Blue
- 958184
≈ Venetian
Geteilt komplementär +150° +210°
- 838A7A
Spruce Shadow
- 838696
≈ Blue Jasmine
- 91828D
≈ Lavendaire
Tetradisch +90° +180° +270°
- 838A7A
Spruce Shadow
- 778B91
≈ Leisure Time
- 8B8393
≈ Purple Ash
- 95827D
≈ Castle Hill
Kontrast & Barrierefreiheit
Ag
FailAuf Weiß
WCAG 3.57:1 · APCA Lc 63
Ag
AAAuf Schwarz
WCAG 5.88:1 · APCA Lc 38
Beste Textfarbe: #000000
WCAG 5.88:1 (AA) · APCA Lc 38
Contrast pairs
Code-Snippets
CSS
:root {
--spruce-shadow: #838a7a;
--spruce-shadow-rgb: 131 138 122;
--spruce-shadow-oklch: oklch(0.623 0.025 126.4);
}
.element {
color: var(--spruce-shadow);
background-color: hsl(86 6% 51%);
border-color: oklch(0.623 0.025 126.4);
}Tailwind CSS v4
@theme {
--color-spruce-shadow: #838a7a;
--color-spruce-shadow-50: #f3f7ef;
--color-spruce-shadow-100: #e5eae1;
--color-spruce-shadow-200: #d1d6cb;
--color-spruce-shadow-300: #b3baad;
--color-spruce-shadow-400: #9aa192;
--color-spruce-shadow-500: #828978;
--color-spruce-shadow-600: #6e7466;
--color-spruce-shadow-700: #585d51;
--color-spruce-shadow-800: #40443b;
--color-spruce-shadow-900: #2c2f28;
--color-spruce-shadow-950: #191b16;
}SCSS
$spruce-shadow: #838a7a;
$spruce-shadow-rgb: 131, 138, 122;
$spruce-shadow-light: mix(#fff, $spruce-shadow, 20%);
$spruce-shadow-dark: mix(#000, $spruce-shadow, 20%);
.element {
color: $spruce-shadow;
box-shadow: 0 0 0 2px rgba($spruce-shadow, 0.35);
}