← Back to Editor

#7C9D7E · #837946 · #617A66 · #797B6C · #615950

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

#7C9D7E

Celadon · Gray · Olive Green

HEX
#7C9D7E
RGB
rgb(124, 157, 126)
HSL
hsl(124, 14%, 55%)
HSB
hsb(124, 21%, 62%)
CMYK
cmyk(21%, 0%, 20%, 38%)
Oklch
oklch(66.2% 0.058 146.5)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#837946

Autumn Sage · DimGray · Honey Gold

HEX
#837946
RGB
rgb(131, 121, 70)
HSL
hsl(50, 30%, 39%)
HSB
hsb(50, 47%, 51%)
CMYK
cmyk(0%, 8%, 47%, 49%)
Oklch
oklch(57.3% 0.071 98.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#617A66

Celadon · DimGray · Olive Green

HEX
#617A66
RGB
rgb(97, 122, 102)
HSL
hsl(132, 11%, 43%)
HSB
hsb(132, 20%, 48%)
CMYK
cmyk(20%, 0%, 16%, 52%)
Oklch
oklch(55.4% 0.042 150.8)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#797B6C

Ink Gray · Gray · Warm Gray

HEX
#797B6C
RGB
rgb(121, 123, 108)
HSL
hsl(68, 6%, 45%)
HSB
hsb(68, 12%, 48%)
CMYK
cmyk(2%, 0%, 12%, 52%)
Oklch
oklch(57.7% 0.022 113.3)

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

#615950

Ochre · DimGray · Amber Brown

HEX
#615950
RGB
rgb(97, 89, 80)
HSL
hsl(32, 10%, 35%)
HSB
hsb(32, 18%, 38%)
CMYK
cmyk(0%, 8%, 18%, 62%)
Oklch
oklch(46.9% 0.018 70.6)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7C9D7E
9C7C9A

Analogous

8A9C7C
7C9D7E
7C9C8E

Triadic

7C9D7E
7E7C9C
9C7E7C

Split-Comp.

7C9D7E
8E7C9C
9C7C8A

Tetradic

7C9D7E
7C8A9C
9C7C9A
9C8E7C

Contrast Matrix WCAG 2.1 Contrast

7C9D7E
837946
617A66
797B6C
615950
—
1.5
Fail
1.6
Fail
1.4
Fail
2.3
Fail
1.5
Fail
—
1.1
Fail
1.0
Fail
1.6
Fail
1.6
Fail
1.1
Fail
—
1.1
Fail
1.5
Fail
1.4
Fail
1.0
Fail
1.1
Fail
—
1.6
Fail
2.3
Fail
1.6
Fail
1.5
Fail
1.6
Fail
—
White BG
3.0AA Large
4.4AA Large
4.7AA
4.3AA Large
6.9AA
Black BG
7.0AA
4.8AA
4.5AA Large
4.9AA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

8A8B86
7F7F52
6C6C6B
7A7A70
5E5D52

Deuteranopia

888687
7F8055
6A696C
7A7A71
5E5F53

Tritanopia

7E8B8D
835C5E
626F70
797273
615454

Achromatopsia

909090
767676
707070
797979
5A5A5A

Shades & Tints Shades & Tints

#7C9D7E

Dark
Light

#837946

Dark
Light

#617A66

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7c9d7e;
  --color-2: #837946;
  --color-3: #617a66;
  --color-4: #797b6c;
  --color-5: #615950;
}

SCSS

$color-1: #7c9d7e;
$color-2: #837946;
$color-3: #617a66;
$color-4: #797b6c;
$color-5: #615950;

TAILWIND

colors: {
  'brand-1': '#7c9d7e',
  'brand-2': '#837946',
  'brand-3': '#617a66',
  'brand-4': '#797b6c',
  'brand-5': '#615950',
}

RGB Array

[124, 157, 126], [131, 121, 70], [97, 122, 102], [121, 123, 108], [97, 89, 80]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7C9D7E, #837946, #617A66, #797B6C, #615950 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: #7c9d7e; --color-2: #837946; --color-3: #617a66; --color-4: #797b6c; --color-5: #615950. 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