Named color · #746F5C
Momentum
Momentum is #746F5C: rgb(116 111 92), hsl(48 12% 41%), oklch(0.541 0.029 95). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Momentum color name →
#746F5C
oklch(0.541 0.029 95)
Color conversions
- HEX
- #746f5c
- RGB
- rgb(116 111 92)
- HSL
- hsl(48 12% 41%)
- HWB
- hwb(48 36% 55%)
- OKLCH
- oklch(0.541 0.029 95)
- OKLab
- oklab(0.541 -0.003 0.029)
- CIE Lab
- lab(46.88 -0.54 11.36)
- LCH
- lch(46.88 11.38 92.7)
- CMYK
- cmyk(0% 4% 21% 55%)
Tints · Shades · Tones
Tints
- 817C6B
- 8E8A7A
- 9C988A
- A9A69A
- B7B4AA
- C5C3BB
- D3D2CB
- E2E1DC
- F0F0EE
Shades
- 64604F
- 545142
- 454236
- 37342A
- 29271F
- 1B1A14
- 0F0E0A
- 050403
- 010100
Tones
- 757160
- 767263
- 787467
- 79766A
- 7A786E
- 7B7972
- 7C7B75
- 7E7D79
- 7F7E7C
Color harmonies
Complementary +180°
- 746F5C
Momentum
- 6A6E80
≈ Mountain Haze
Analogous -30° +30°
- 746F5C
Momentum
- 7B6C5D
≈ Sleeping Giant
- 6B7260
≈ Shutters
Triadic +120° +240°
- 746F5C
Momentum
- 5C747A
≈ Blue Sage
- 7A6976
≈ Mystical Trip
Split-complementary +150° +210°
- 746F5C
Momentum
- 61717F
≈ Buoyant
- 736B7D
≈ Purple Sage
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
AAOn white
WCAG 5.03:1 · APCA Lc 75
Ag
FailOn black
WCAG 4.17:1 · APCA Lc 27
Best text color: #FFFFFF
WCAG 5.03:1 (AA) · APCA Lc 75
Contrast pairs
Code snippets
CSS
:root {
--momentum: #746f5c;
--momentum-rgb: 116 111 92;
--momentum-oklch: oklch(0.541 0.029 95);
}
.element {
color: var(--momentum);
background-color: hsl(48 12% 41%);
border-color: oklch(0.541 0.029 95);
}Tailwind CSS v4
@theme {
--color-momentum: #746f5c;
--color-momentum-50: #f7f5ec;
--color-momentum-100: #eae8dd;
--color-momentum-200: #d7d5c7;
--color-momentum-300: #bbb8a7;
--color-momentum-400: #a49f8b;
--color-momentum-500: #8c8671;
--color-momentum-600: #767260;
--color-momentum-700: #5f5b4c;
--color-momentum-800: #464237;
--color-momentum-900: #302e26;
--color-momentum-950: #1c1b14;
}SCSS
$momentum: #746f5c;
$momentum-rgb: 116, 111, 92;
$momentum-light: mix(#fff, $momentum, 20%);
$momentum-dark: mix(#000, $momentum, 20%);
.element {
color: $momentum;
box-shadow: 0 0 0 2px rgba($momentum, 0.35);
}