← Back to Editor

#574442 · #6A506D · #947473 · #BE9878 · #E8BC7E

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

#574442

Crimson · DarkOliveGreen · Wine Red

HEX
#574442
RGB
rgb(87, 68, 66)
HSL
hsl(6, 14%, 30%)
HSB
hsb(6, 24%, 34%)
CMYK
cmyk(0%, 22%, 24%, 66%)
Oklch
oklch(40.6% 0.027 25.3)

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

#6A506D

Dark Plum · DimGray · Eggplant

HEX
#6A506D
RGB
rgb(106, 80, 109)
HSL
hsl(294, 15%, 37%)
HSB
hsb(294, 27%, 43%)
CMYK
cmyk(3%, 27%, 0%, 57%)
Oklch
oklch(46.9% 0.056 323.0)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#947473

Crimson · Gray · Passion Red

HEX
#947473
RGB
rgb(148, 116, 115)
HSL
hsl(2, 13%, 52%)
HSB
hsb(2, 22%, 58%)
CMYK
cmyk(0%, 22%, 22%, 42%)
Oklch
oklch(59.0% 0.040 20.4)

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

#BE9878

Apricot · Tan · Warm Sun

HEX
#BE9878
RGB
rgb(190, 152, 120)
HSL
hsl(27, 35%, 61%)
HSB
hsb(27, 37%, 75%)
CMYK
cmyk(0%, 20%, 37%, 25%)
Oklch
oklch(70.7% 0.064 61.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E8BC7E

Ginger · BurlyWood · Warm Sun

HEX
#E8BC7E
RGB
rgb(232, 188, 126)
HSL
hsl(35, 70%, 70%)
HSB
hsb(35, 46%, 91%)
CMYK
cmyk(0%, 19%, 46%, 9%)
Oklch
oklch(82.0% 0.094 75.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

574442
425557

Analogous

57424A
574442
574F42

Triadic

574442
425744
444257

Split-Comp.

574442
42574F
424A57

Tetradic

574442
4A5742
425557
4F4257

Contrast Matrix WCAG 2.1 Contrast

574442
6A506D
947473
BE9878
E8BC7E
—
1.3
Fail
2.2
Fail
3.4
AA Large
5.2
AA
1.3
Fail
—
1.7
Fail
2.7
Fail
4.0
AA Large
2.2
Fail
1.7
Fail
—
1.6
Fail
2.4
Fail
3.4
AA Large
2.7
Fail
1.6
Fail
—
1.5
Fail
5.2
AA
4.0
AA Large
2.4
Fail
1.5
Fail
—
White BG
9.1AAA
7.0AAA
4.2AA Large
2.6Fail
1.8Fail
Black BG
2.3Fail
3.0Fail
5.0AA
8.0AAA
11.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F4F42
5F5F66
868673
AEAD80
D5D58D

Deuteranopia

505143
606264
888A73
B0B382
D8DB91

Tritanopia

564343
69605F
927373
BC8687
E6999B

Achromatopsia

494949
5B5B5B
7D7D7D
A0A0A0
C2C2C2

Shades & Tints Shades & Tints

#574442

Dark
Light

#6A506D

Dark
Light

#947473

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #574442;
  --color-2: #6a506d;
  --color-3: #947473;
  --color-4: #be9878;
  --color-5: #e8bc7e;
}

SCSS

$color-1: #574442;
$color-2: #6a506d;
$color-3: #947473;
$color-4: #be9878;
$color-5: #e8bc7e;

TAILWIND

colors: {
  'brand-1': '#574442',
  'brand-2': '#6a506d',
  'brand-3': '#947473',
  'brand-4': '#be9878',
  'brand-5': '#e8bc7e',
}

RGB Array

[87, 68, 66], [106, 80, 109], [148, 116, 115], [190, 152, 120], [232, 188, 126]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #574442, #6A506D, #947473, #BE9878, #E8BC7E 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: #574442; --color-2: #6a506d; --color-3: #947473; --color-4: #be9878; --color-5: #e8bc7e. 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