Named color · #7C7C65
Tangle
Tangle is #7C7C65: rgb(124 124 101), hsl(60 10% 44%), oklch(0.58 0.034 107.4). See tints, shades, harmonies, WCAG & APCA contrast, and CSS, Tailwind v4 & SCSS code.
What does Gray mean? → · Tangle color name →
#7C7C65
oklch(0.58 0.034 107.4)
Color conversions
- HEX
- #7c7c65
- RGB
- rgb(124 124 101)
- HSL
- hsl(60 10% 44%)
- HWB
- hwb(60 40% 51%)
- OKLCH
- oklch(0.58 0.034 107.4)
- OKLab
- oklab(0.58 -0.01 0.032)
- CIE Lab
- lab(51.52 -3.12 12.63)
- LCH
- lch(51.52 13.01 103.9)
- CMYK
- cmyk(0% 0% 19% 51%)
Tints · Shades · Tones
Tints
- 888873
- 959582
- A1A291
- AEAEA0
- BBBBAF
- C8C9BF
- D6D6CF
- E3E4DE
- F1F1EF
Shades
- 6B6B57
- 5A5A49
- 4A4A3C
- 3B3B2F
- 2C2C22
- 1E1E17
- 11110C
- 050503
- 010100
Tones
- 7C7C68
- 7D7D6B
- 7D7D6D
- 7E7E70
- 7E7E73
- 7E7E75
- 7F7F78
- 7F7F7B
- 80807D
Color harmonies
Complementary +180°
- 7C7C65
Tangle
- 79788E
≈ Blue Granite
Analogous -30° +30°
- 7C7C65
Tangle
- 867864
≈ Mountain Elk
- 717F6C
≈ Greenland
Triadic +120° +240°
- 7C7C65
Tangle
- 667F8A
≈ Windy Seas
- 8A727E
≈ Wiped Out
Split-complementary +150° +210°
- 7C7C65
Tangle
- 6E7B8F
≈ Causeway
- 837488
≈ Hyacinth Dream
Tetradic +90° +180° +270°
Contrast & accessibility
Ag
FailOn white
WCAG 4.26:1 · APCA Lc 69
Ag
AAOn black
WCAG 4.92:1 · APCA Lc 32
Best text color: #000000
WCAG 4.92:1 (AA) · APCA Lc 32
Contrast pairs
Code snippets
CSS
:root {
--tangle: #7c7c65;
--tangle-rgb: 124 124 101;
--tangle-oklch: oklch(0.58 0.034 107.4);
}
.element {
color: var(--tangle);
background-color: hsl(60 10% 44%);
border-color: oklch(0.58 0.034 107.4);
}Tailwind CSS v4
@theme {
--color-tangle: #7c7c65;
--color-tangle-50: #f5f6eb;
--color-tangle-100: #e8e9dc;
--color-tangle-200: #d5d6c5;
--color-tangle-300: #b8b9a6;
--color-tangle-400: #a0a089;
--color-tangle-500: #88886e;
--color-tangle-600: #73735e;
--color-tangle-700: #5c5c4b;
--color-tangle-800: #444336;
--color-tangle-900: #2f2e25;
--color-tangle-950: #1b1b13;
}SCSS
$tangle: #7c7c65;
$tangle-rgb: 124, 124, 101;
$tangle-light: mix(#fff, $tangle, 20%);
$tangle-dark: mix(#000, $tangle, 20%);
.element {
color: $tangle;
box-shadow: 0 0 0 2px rgba($tangle, 0.35);
}