← Back to Editor

#7A7D7B · #948D85 · #997D7D · #997171 · #5C4D4C

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7A7D7B

Ink Gray · Gray · Warm Gray

HEX
#7A7D7B
RGB
rgb(122, 125, 123)
HSL
hsl(140, 1%, 48%)
HSB
hsb(140, 2%, 49%)
CMYK
cmyk(2%, 0%, 2%, 51%)
Oklch
oklch(58.7% 0.005 157.1)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#948D85

Ash · Gray · Warm Gray

HEX
#948D85
RGB
rgb(148, 141, 133)
HSL
hsl(32, 7%, 55%)
HSB
hsb(32, 10%, 58%)
CMYK
cmyk(0%, 5%, 10%, 42%)
Oklch
oklch(64.7% 0.014 71.2)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#997D7D

Crimson · Gray · Passion Red

HEX
#997D7D
RGB
rgb(153, 125, 125)
HSL
hsl(0, 12%, 55%)
HSB
hsb(0, 18%, 60%)
CMYK
cmyk(0%, 18%, 18%, 40%)
Oklch
oklch(61.6% 0.035 18.1)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#997171

Crimson · Gray · Passion Red

HEX
#997171
RGB
rgb(153, 113, 113)
HSL
hsl(0, 16%, 52%)
HSB
hsb(0, 26%, 60%)
CMYK
cmyk(0%, 26%, 26%, 40%)
Oklch
oklch(58.9% 0.051 18.7)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#5C4D4C

Crimson · DarkOliveGreen · Wine Red

HEX
#5C4D4C
RGB
rgb(92, 77, 76)
HSL
hsl(4, 10%, 33%)
HSB
hsb(4, 17%, 36%)
CMYK
cmyk(0%, 16%, 17%, 64%)
Oklch
oklch(43.5% 0.020 22.5)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A7D7B
7C797B

Analogous

7A7C79
7A7D7B
797C7B

Triadic

7A7D7B
7A797C
7C7A79

Split-Comp.

7A7D7B
7B797C
7C797A

Tetradic

7A7D7B
797A7C
7C797B
7C7B79

Contrast Matrix WCAG 2.1 Contrast

7A7D7B
948D85
997D7D
997171
5C4D4C
—
1.3
Fail
1.1
Fail
1.0
Fail
1.9
Fail
1.3
Fail
—
1.1
Fail
1.3
Fail
2.4
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
2.1
Fail
1.0
Fail
1.3
Fail
1.1
Fail
—
1.9
Fail
1.9
Fail
2.4
Fail
2.1
Fail
1.9
Fail
—
White BG
4.2AA Large
3.3AA Large
3.8AA Large
4.2AA Large
8.0AAA
Black BG
5.0AA
6.4AA
5.6AA
5.0AA
2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7B7B
919187
8D8D7D
888771
56554C

Deuteranopia

7B7B7C
919287
8F917D
8A8D71
56574C

Tritanopia

7A7C7C
948889
987D7D
977171
5B4C4C

Achromatopsia

7C7C7C
8E8E8E
858585
7D7D7D
515151

Shades & Tints Shades & Tints

#7A7D7B

Dark
Light

#948D85

Dark
Light

#997D7D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a7d7b;
  --color-2: #948d85;
  --color-3: #997d7d;
  --color-4: #997171;
  --color-5: #5c4d4c;
}

SCSS

$color-1: #7a7d7b;
$color-2: #948d85;
$color-3: #997d7d;
$color-4: #997171;
$color-5: #5c4d4c;

TAILWIND

colors: {
  'brand-1': '#7a7d7b',
  'brand-2': '#948d85',
  'brand-3': '#997d7d',
  'brand-4': '#997171',
  'brand-5': '#5c4d4c',
}

RGB Array

[122, 125, 123], [148, 141, 133], [153, 125, 125], [153, 113, 113], [92, 77, 76]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A7D7B, #948D85, #997D7D, #997171, #5C4D4C is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #7a7d7b; --color-2: #948d85; --color-3: #997d7d; --color-4: #997171; --color-5: #5c4d4c. LangColor editor supports one-click export to CSS, SCSS, Tailwind, JSON and more. Click the "Export" button to choose your format.

What UI/UX design tips apply to this palette?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. Use the "Contrast Matrix" tool in LangColor editor to check WCAG accessibility levels for every color pair.

Which industries or brands suit this palette?

This general-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. Restrained colors convey professionalism and trust. Click "AI Analysis" in the editor for more detailed brand color suggestions.

🎨 Open this palette in Editor →

Generated by LangColor online color tool · Breaking the barrier between language and color