← Back to Editor

#7A6F58 · #470A3E · #692A60 · #805178 · #D6A84C

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 LibraryData Visualization

Color Details Color Details

#7A6F58

Ochre · DimGray · Honey Gold

HEX
#7A6F58
RGB
rgb(122, 111, 88)
HSL
hsl(41, 16%, 41%)
HSB
hsb(41, 28%, 48%)
CMYK
cmyk(0%, 9%, 28%, 52%)
Oklch
oklch(54.5% 0.037 85.4)

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

#470A3E

Rose Purple · MidnightBlue · Dark Purple

HEX
#470A3E
RGB
rgb(71, 10, 62)
HSL
hsl(309, 75%, 16%)
HSB
hsb(309, 86%, 28%)
CMYK
cmyk(0%, 86%, 13%, 72%)
Oklch
oklch(28.2% 0.110 335.0)

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

#692A60

Rose Purple · DarkSlateBlue · Eggplant

HEX
#692A60
RGB
rgb(105, 42, 96)
HSL
hsl(309, 43%, 29%)
HSB
hsb(309, 60%, 41%)
CMYK
cmyk(0%, 60%, 9%, 59%)
Oklch
oklch(39.5% 0.115 333.4)

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

#805178

Rose Purple · DimGray · Violet

HEX
#805178
RGB
rgb(128, 81, 120)
HSL
hsl(310, 22%, 41%)
HSB
hsb(310, 37%, 50%)
CMYK
cmyk(0%, 37%, 6%, 50%)
Oklch
oklch(50.1% 0.084 333.1)

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

#D6A84C

Ginger · SandyBrown · Sunflower

HEX
#D6A84C
RGB
rgb(214, 168, 76)
HSL
hsl(40, 63%, 57%)
HSB
hsb(40, 64%, 84%)
CMYK
cmyk(0%, 21%, 64%, 16%)
Oklch
oklch(75.6% 0.122 82.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7A6F58
586279

Analogous

795E58
7A6F58
737958

Triadic

7A6F58
58796F
6F5879

Split-Comp.

7A6F58
587379
5E5879

Tetradic

7A6F58
58795E
586279
795873

Contrast Matrix WCAG 2.1 Contrast

7A6F58
470A3E
692A60
805178
D6A84C
—
3.1
AA Large
2.0
Fail
1.3
Fail
2.3
Fail
3.1
AA Large
—
1.5
Fail
2.4
Fail
6.9
AA
2.0
Fail
1.5
Fail
—
1.6
Fail
4.6
AA
1.3
Fail
2.4
Fail
1.6
Fail
—
2.8
Fail
2.3
Fail
6.9
AA
4.6
AA
2.8
Fail
—
White BG
5.0AA
15.2AAA
10.0AAA
6.2AA
2.2Fail
Black BG
4.2AA Large
1.4Fail
2.1Fail
3.4AA Large
9.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

75755E
2D2C31
4E4D53
6C6B6F
C2C262

Deuteranopia

76775F
30352E
515650
6E726C
C5C868

Tritanopia

796263
442725
664946
7E6765
D47478

Achromatopsia

707070
222222
434343
636363
ABABAB

Shades & Tints Shades & Tints

#7A6F58

Dark
Light

#470A3E

Dark
Light

#692A60

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7a6f58;
  --color-2: #470a3e;
  --color-3: #692a60;
  --color-4: #805178;
  --color-5: #d6a84c;
}

SCSS

$color-1: #7a6f58;
$color-2: #470a3e;
$color-3: #692a60;
$color-4: #805178;
$color-5: #d6a84c;

TAILWIND

colors: {
  'brand-1': '#7a6f58',
  'brand-2': '#470a3e',
  'brand-3': '#692a60',
  'brand-4': '#805178',
  'brand-5': '#d6a84c',
}

RGB Array

[122, 111, 88], [71, 10, 62], [105, 42, 96], [128, 81, 120], [214, 168, 76]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7A6F58, #470A3E, #692A60, #805178, #D6A84C is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #7a6f58; --color-2: #470a3e; --color-3: #692a60; --color-4: #805178; --color-5: #d6a84c. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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