Named color · #A3AA8C
Mountain Sage
Mountain Sage is #A3AA8C: rgb(163 170 140), hsl(74 15% 61%), oklch(0.724 0.043 118.1). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Yellow mean? → · Mountain Sage color name →
#A3AA8C
oklch(0.724 0.043 118.1)
Color conversions
- HEX
- #a3aa8c
- RGB
- rgb(163 170 140)
- HSL
- hsl(74 15% 61%)
- HWB
- hwb(74 55% 33%)
- OKLCH
- oklch(0.724 0.043 118.1)
- OKLab
- oklab(0.724 -0.02 0.038)
- CIE Lab
- lab(68.43 -6.56 14.65)
- LCH
- lch(68.43 16.05 114.1)
- CMYK
- cmyk(4% 0% 18% 33%)
Tints · Shades · Tones
Tints
- ACB297
- B5BBA2
- BEC3AE
- C7CBB9
- D0D4C4
- D9DCD0
- E3E5DC
- ECEEE7
- F5F6F3
Shades
- 8D9379
- 787D67
- 636855
- 4F5343
- 3C3F33
- 2A2D23
- 191B14
- 0A0B07
- 010101
Tones
- 9FA68B
- 9CA18A
- 989D89
- 959987
- 919586
- 8E9185
- 8A8C84
- 878883
- 838481
Color harmonies
Complementary +180°
- A3AA8C
Mountain Sage
- A9A1BE
≈ Royal Proclamation
Analogous -30° +30°
- A3AA8C
Mountain Sage
- B1A588
≈ Karma
- 94AE97
≈ Andean Slate
Triadic +120° +240°
- A3AA8C
Mountain Sage
- 8EAABE
≈ Sky Eyes
- BD9BA6
≈ Pale Petticoat
Split-complementary +150° +210°
- A3AA8C
Mountain Sage
- 9AA6C2
≈ Wild Phlox
- B59DB4
≈ Pastel Purple
Tetradic +90° +180° +270°
- A3AA8C
Mountain Sage
- 87AEB4
≈ Bon Voyage
- A9A1BE
≈ Royal Proclamation
- BF9C97
≈ Coca Mocha
Contrast & accessibility
Ag
FailOn white
WCAG 2.41:1 · APCA Lc 48
Ag
AAAOn black
WCAG 8.68:1 · APCA Lc 54
Best text color: #000000
WCAG 8.68:1 (AAA) · APCA Lc 54
Contrast pairs
Code snippets
CSS
:root {
--mountain-sage: #a3aa8c;
--mountain-sage-rgb: 163 170 140;
--mountain-sage-oklch: oklch(0.724 0.043 118.1);
}
.element {
color: var(--mountain-sage);
background-color: hsl(74 15% 61%);
border-color: oklch(0.724 0.043 118.1);
}Tailwind CSS v4
@theme {
--color-mountain-sage: #a3aa8c;
--color-mountain-sage-50: #f3f7ea;
--color-mountain-sage-100: #e6eadb;
--color-mountain-sage-200: #d1d7c3;
--color-mountain-sage-300: #b4bba3;
--color-mountain-sage-400: #9ca286;
--color-mountain-sage-500: #838a6a;
--color-mountain-sage-600: #6f755a;
--color-mountain-sage-700: #595e48;
--color-mountain-sage-800: #414434;
--color-mountain-sage-900: #2d2f23;
--color-mountain-sage-950: #1a1c12;
}SCSS
$mountain-sage: #a3aa8c;
$mountain-sage-rgb: 163, 170, 140;
$mountain-sage-light: mix(#fff, $mountain-sage, 20%);
$mountain-sage-dark: mix(#000, $mountain-sage, 20%);
.element {
color: $mountain-sage;
box-shadow: 0 0 0 2px rgba($mountain-sage, 0.35);
}