← Back to Editor

#6C5C45 · #7A5557 · #894D69 · #97467B · #A53E8D

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

#6C5C45

Ochre · DarkOliveGreen · Amber Brown

HEX
#6C5C45
RGB
rgb(108, 92, 69)
HSL
hsl(35, 22%, 35%)
HSB
hsb(35, 36%, 42%)
CMYK
cmyk(0%, 15%, 36%, 58%)
Oklch
oklch(48.4% 0.040 76.5)

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

#7A5557

Crimson · DimGray · Passion Red

HEX
#7A5557
RGB
rgb(122, 85, 87)
HSL
hsl(357, 18%, 41%)
HSB
hsb(357, 30%, 48%)
CMYK
cmyk(0%, 30%, 29%, 52%)
Oklch
oklch(49.0% 0.049 15.5)

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

#894D69

Dark Violet · DimGray · Camellia

HEX
#894D69
RGB
rgb(137, 77, 105)
HSL
hsl(332, 28%, 42%)
HSB
hsb(332, 44%, 54%)
CMYK
cmyk(0%, 44%, 23%, 46%)
Oklch
oklch(50.0% 0.088 351.4)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#97467B

Rose Purple · DimGray · Camellia

HEX
#97467B
RGB
rgb(151, 70, 123)
HSL
hsl(321, 37%, 43%)
HSB
hsb(321, 54%, 59%)
CMYK
cmyk(0%, 54%, 19%, 41%)
Oklch
oklch(51.5% 0.127 342.5)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#A53E8D

Rose Purple · MediumVioletRed · Violet

HEX
#A53E8D
RGB
rgb(165, 62, 141)
HSL
hsl(314, 45%, 45%)
HSB
hsb(314, 62%, 65%)
CMYK
cmyk(0%, 62%, 15%, 35%)
Oklch
oklch(53.3% 0.164 337.9)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6C5C45
46566D

Analogous

6D4946
6C5C45
6A6D46

Triadic

6C5C45
466D5D
5D466D

Split-Comp.

6C5C45
466A6D
49466D

Tetradic

6C5C45
466D49
46566D
6D466A

Contrast Matrix WCAG 2.1 Contrast

6C5C45
7A5557
894D69
97467B
A53E8D
—
1.0
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.0
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.0
Fail
—
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
White BG
6.5AA
6.4AA
6.3AA
6.0AA
5.7AA
Black BG
3.3AA Large
3.3AA Large
3.3AA Large
3.5AA Large
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

65654B
6A6A57
6F6E62
74736E
78777A

Deuteranopia

66674C
6C6F56
737761
797F6B
7E8675

Tritanopia

6B4F50
785656
865D5C
936462
A06B67

Achromatopsia

5E5E5E
606060
626262
646464
666666

Shades & Tints Shades & Tints

#6C5C45

Dark
Light

#7A5557

Dark
Light

#894D69

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6c5c45;
  --color-2: #7a5557;
  --color-3: #894d69;
  --color-4: #97467b;
  --color-5: #a53e8d;
}

SCSS

$color-1: #6c5c45;
$color-2: #7a5557;
$color-3: #894d69;
$color-4: #97467b;
$color-5: #a53e8d;

TAILWIND

colors: {
  'brand-1': '#6c5c45',
  'brand-2': '#7a5557',
  'brand-3': '#894d69',
  'brand-4': '#97467b',
  'brand-5': '#a53e8d',
}

RGB Array

[108, 92, 69], [122, 85, 87], [137, 77, 105], [151, 70, 123], [165, 62, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6C5C45, #7A5557, #894D69, #97467B, #A53E8D is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #6c5c45; --color-2: #7a5557; --color-3: #894d69; --color-4: #97467b; --color-5: #a53e8d. 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. 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