← Back to Editor

#041D20 · #2E544D · #5F624D · #ABA76C · #E2C6BA

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

#041D20

Lake Blue · Black · Peacock Green

HEX
#041D20
RGB
rgb(4, 29, 32)
HSL
hsl(186, 78%, 7%)
HSB
hsb(186, 88%, 13%)
CMYK
cmyk(88%, 9%, 0%, 87%)
Oklch
oklch(21.3% 0.032 205.9)

Traditional「Lake Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#2E544D

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#2E544D
RGB
rgb(46, 84, 77)
HSL
hsl(169, 29%, 25%)
HSB
hsb(169, 45%, 33%)
CMYK
cmyk(45%, 0%, 8%, 67%)
Oklch
oklch(41.5% 0.045 180.8)

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

#5F624D

Autumn Sage · DimGray · Honey Gold

HEX
#5F624D
RGB
rgb(95, 98, 77)
HSL
hsl(69, 12%, 34%)
HSB
hsb(69, 21%, 38%)
CMYK
cmyk(3%, 0%, 21%, 62%)
Oklch
oklch(48.7% 0.032 114.2)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#ABA76C

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#ABA76C
RGB
rgb(171, 167, 108)
HSL
hsl(56, 27%, 55%)
HSB
hsb(56, 37%, 67%)
CMYK
cmyk(0%, 2%, 37%, 33%)
Oklch
oklch(71.8% 0.079 104.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#E2C6BA

Apricot · Wheat · Peach Orange

HEX
#E2C6BA
RGB
rgb(226, 198, 186)
HSL
hsl(18, 41%, 81%)
HSB
hsb(18, 18%, 89%)
CMYK
cmyk(0%, 12%, 18%, 11%)
Oklch
oklch(84.7% 0.036 44.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

041D20
200704

Analogous

042015
041D20
040F20

Triadic

041D20
20041D
1D2004

Split-Comp.

041D20
20040F
201504

Tetradic

041D20
150420
200704
0F2004

Contrast Matrix WCAG 2.1 Contrast

041D20
2E544D
5F624D
ABA76C
E2C6BA
—
2.1
Fail
2.8
Fail
7.1
AAA
10.8
AAA
2.1
Fail
—
1.3
Fail
3.4
AA Large
5.2
AA
2.8
Fail
1.3
Fail
—
2.5
Fail
3.9
AA Large
7.1
AAA
3.4
AA Large
2.5
Fail
—
1.5
Fail
10.8
AAA
5.2
AA
3.9
AA Large
1.5
Fail
—
White BG
17.5AAA
8.4AAA
6.3AA
2.5Fail
1.6Fail
Black BG
1.2Fail
2.5Fail
3.3AA Large
8.5AAA
13.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

0F0F1F
3E3F4F
606052
A9A97A
D6D6BD

Deuteranopia

0D0C1F
3C394F
606053
AAAA7E
D8DABE

Tritanopia

051F1F
305050
5F5657
AB8688
E1BFC0

Achromatopsia

161616
484848
5F5F5F
A1A1A1
CDCDCD

Shades & Tints Shades & Tints

#041D20

Dark
Light

#2E544D

Dark
Light

#5F624D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #041d20;
  --color-2: #2e544d;
  --color-3: #5f624d;
  --color-4: #aba76c;
  --color-5: #e2c6ba;
}

SCSS

$color-1: #041d20;
$color-2: #2e544d;
$color-3: #5f624d;
$color-4: #aba76c;
$color-5: #e2c6ba;

TAILWIND

colors: {
  'brand-1': '#041d20',
  'brand-2': '#2e544d',
  'brand-3': '#5f624d',
  'brand-4': '#aba76c',
  'brand-5': '#e2c6ba',
}

RGB Array

[4, 29, 32], [46, 84, 77], [95, 98, 77], [171, 167, 108], [226, 198, 186]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #041D20, #2E544D, #5F624D, #ABA76C, #E2C6BA is ideal for: 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: #041d20; --color-2: #2e544d; --color-3: #5f624d; --color-4: #aba76c; --color-5: #e2c6ba. 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. 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