← Back to Editor

#8C8C81 · #666250 · #574735 · #573C27 · #57251D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporate

Color Details Color Details

#8C8C81

Ash · Gray · Warm Gray

HEX
#8C8C81
RGB
rgb(140, 140, 129)
HSL
hsl(60, 5%, 53%)
HSB
hsb(60, 8%, 55%)
CMYK
cmyk(0%, 0%, 8%, 45%)
Oklch
oklch(63.7% 0.016 106.8)

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

#666250

Ochre · DimGray · Honey Gold

HEX
#666250
RGB
rgb(102, 98, 80)
HSL
hsl(49, 12%, 36%)
HSB
hsb(49, 22%, 40%)
CMYK
cmyk(0%, 4%, 22%, 60%)
Oklch
oklch(49.5% 0.028 96.9)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#574735

Ochre · DarkOliveGreen · Amber Brown

HEX
#574735
RGB
rgb(87, 71, 53)
HSL
hsl(32, 24%, 27%)
HSB
hsb(32, 39%, 34%)
CMYK
cmyk(0%, 18%, 39%, 66%)
Oklch
oklch(40.9% 0.036 69.9)

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

#573C27

Tangerine · DarkOliveGreen · Cinnamon

HEX
#573C27
RGB
rgb(87, 60, 39)
HSL
hsl(26, 38%, 25%)
HSB
hsb(26, 55%, 34%)
CMYK
cmyk(0%, 31%, 55%, 66%)
Oklch
oklch(38.1% 0.050 58.4)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#57251D

Crimson · Maroon · Wine Red

HEX
#57251D
RGB
rgb(87, 37, 29)
HSL
hsl(8, 50%, 23%)
HSB
hsb(8, 67%, 34%)
CMYK
cmyk(0%, 57%, 67%, 66%)
Oklch
oklch(33.4% 0.076 30.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8C8C81
81818D

Analogous

8D8781
8C8C81
878D81

Triadic

8C8C81
818D8D
8D818D

Split-Comp.

8C8C81
81878D
87818D

Tetradic

8C8C81
818D87
81818D
8D8187

Contrast Matrix WCAG 2.1 Contrast

8C8C81
666250
574735
573C27
57251D
—
1.8
Fail
2.6
Fail
3.0
Fail
3.7
AA Large
1.8
Fail
—
1.5
Fail
1.6
Fail
2.0
Fail
2.6
Fail
1.5
Fail
—
1.1
Fail
1.4
Fail
3.0
Fail
1.6
Fail
1.1
Fail
—
1.2
Fail
3.7
AA Large
2.0
Fail
1.4
Fail
1.2
Fail
—
White BG
3.4AA Large
6.1AA
8.9AAA
10.1AAA
12.4AAA
Black BG
6.2AA
3.4AA Large
2.4Fail
2.1Fail
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8C84
646454
505039
4B4B2C
41411F

Deuteranopia

8C8C84
656555
51523A
4D4F2D
44481F

Tritanopia

8C8686
665859
563D3E
563031
542021

Achromatopsia

8B8B8B
616161
4A4A4A
424242
333333

Shades & Tints Shades & Tints

#8C8C81

Dark
Light

#666250

Dark
Light

#574735

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8c8c81;
  --color-2: #666250;
  --color-3: #574735;
  --color-4: #573c27;
  --color-5: #57251d;
}

SCSS

$color-1: #8c8c81;
$color-2: #666250;
$color-3: #574735;
$color-4: #573c27;
$color-5: #57251d;

TAILWIND

colors: {
  'brand-1': '#8c8c81',
  'brand-2': '#666250',
  'brand-3': '#574735',
  'brand-4': '#573c27',
  'brand-5': '#57251d',
}

RGB Array

[140, 140, 129], [102, 98, 80], [87, 71, 53], [87, 60, 39], [87, 37, 29]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8C8C81, #666250, #574735, #573C27, #57251D is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs. 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: #8c8c81; --color-2: #666250; --color-3: #574735; --color-4: #573c27; --color-5: #57251d. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 finance, legal, luxury 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