← Back to Editor

#578170 · #26241F · #07010D · #C9B9A1 · #AB7200

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#578170

Mineral Blue · DimGray · Olive Green

HEX
#578170
RGB
rgb(87, 129, 112)
HSL
hsl(156, 19%, 42%)
HSB
hsb(156, 33%, 51%)
CMYK
cmyk(33%, 0%, 13%, 49%)
Oklch
oklch(56.7% 0.054 167.3)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#26241F

Ochre · Black · Amber Gold

HEX
#26241F
RGB
rgb(38, 36, 31)
HSL
hsl(43, 10%, 14%)
HSB
hsb(43, 18%, 15%)
CMYK
cmyk(0%, 5%, 18%, 85%)
Oklch
oklch(26.1% 0.010 88.8)

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

#07010D

Royal Purple · Black · Dark Purple

HEX
#07010D
RGB
rgb(7, 1, 13)
HSL
hsl(270, 86%, 3%)
HSB
hsb(270, 92%, 5%)
CMYK
cmyk(46%, 92%, 0%, 95%)
Oklch
oklch(10.4% 0.041 310.8)

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

#C9B9A1

Goose Yellow · Tan · Warm Sun

HEX
#C9B9A1
RGB
rgb(201, 185, 161)
HSL
hsl(36, 27%, 71%)
HSB
hsb(36, 20%, 79%)
CMYK
cmyk(0%, 8%, 20%, 21%)
Oklch
oklch(79.3% 0.038 78.1)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#AB7200

Ochre · DarkGoldenRod · Honey Gold

HEX
#AB7200
RGB
rgb(171, 114, 0)
HSL
hsl(40, 100%, 34%)
HSB
hsb(40, 100%, 67%)
CMYK
cmyk(0%, 33%, 100%, 33%)
Oklch
oklch(59.7% 0.126 74.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

578170
7F5767

Analogous

577F5B
578170
577B7F

Triadic

578170
6F577F
7F6F57

Split-Comp.

578170
7F577B
7F5B57

Tetradic

578170
5B577F
7F5767
7B7F57

Contrast Matrix WCAG 2.1 Contrast

578170
26241F
07010D
C9B9A1
AB7200
—
3.5
AA Large
4.7
AA
2.3
Fail
1.1
Fail
3.5
AA Large
—
1.3
Fail
8.1
AAA
3.8
AA Large
4.7
AA
1.3
Fail
—
10.7
AAA
5.0
AA
2.3
Fail
8.1
AAA
10.7
AAA
—
2.1
Fail
1.1
Fail
3.8
AA Large
5.0
AA
2.1
Fail
—
White BG
4.4AA Large
15.5AAA
20.6AAA
1.9Fail
4.1AA Large
Black BG
4.8AA
1.4Fail
1.0Fail
10.9AAA
5.1AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

696A74
252520
04040A
C2C2A7
92921C

Deuteranopia

676475
252521
050509
C3C4A8
969A22

Tritanopia

597778
262121
070807
C8ABAC
A83136

Achromatopsia

737373
242424
040404
BBBBBB
767676

Shades & Tints Shades & Tints

#578170

Dark
Light

#26241F

Dark
Light

#07010D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #578170;
  --color-2: #26241f;
  --color-3: #07010d;
  --color-4: #c9b9a1;
  --color-5: #ab7200;
}

SCSS

$color-1: #578170;
$color-2: #26241f;
$color-3: #07010d;
$color-4: #c9b9a1;
$color-5: #ab7200;

TAILWIND

colors: {
  'brand-1': '#578170',
  'brand-2': '#26241f',
  'brand-3': '#07010d',
  'brand-4': '#c9b9a1',
  'brand-5': '#ab7200',
}

RGB Array

[87, 129, 112], [38, 36, 31], [7, 1, 13], [201, 185, 161], [171, 114, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #578170, #26241F, #07010D, #C9B9A1, #AB7200 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: #578170; --color-2: #26241f; --color-3: #07010d; --color-4: #c9b9a1; --color-5: #ab7200. 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