← Back to Editor

#04202E · #65490A · #837143 · #AC8F41 · #E2D090

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#04202E

Lake Blue · Black · Deep Sea Blue

HEX
#04202E
RGB
rgb(4, 32, 46)
HSL
hsl(200, 84%, 10%)
HSB
hsb(200, 91%, 18%)
CMYK
cmyk(91%, 30%, 0%, 82%)
Oklch
oklch(23.0% 0.043 234.1)

Traditional「Lake Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

#65490A

Ochre · DarkOliveGreen · Amber Gold

HEX
#65490A
RGB
rgb(101, 73, 10)
HSL
hsl(42, 82%, 22%)
HSB
hsb(42, 90%, 40%)
CMYK
cmyk(0%, 28%, 90%, 60%)
Oklch
oklch(42.5% 0.083 81.6)

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

#837143

Ochre · DimGray · Honey Gold

HEX
#837143
RGB
rgb(131, 113, 67)
HSL
hsl(43, 32%, 39%)
HSB
hsb(43, 49%, 51%)
CMYK
cmyk(0%, 14%, 49%, 49%)
Oklch
oklch(55.5% 0.068 88.8)

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

#AC8F41

Ochre · DarkGoldenRod · Honey Gold

HEX
#AC8F41
RGB
rgb(172, 143, 65)
HSL
hsl(44, 45%, 46%)
HSB
hsb(44, 62%, 67%)
CMYK
cmyk(0%, 17%, 62%, 33%)
Oklch
oklch(66.1% 0.103 88.9)

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

#E2D090

Goose Yellow · BurlyWood · Sunflower

HEX
#E2D090
RGB
rgb(226, 208, 144)
HSL
hsl(47, 59%, 73%)
HSB
hsb(47, 36%, 89%)
CMYK
cmyk(0%, 8%, 36%, 11%)
Oklch
oklch(85.8% 0.085 94.3)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

04202E
2F1204

Analogous

042F28
04202E
040B2F

Triadic

04202E
2F0421
212F04

Split-Comp.

04202E
2F040B
2F2804

Tetradic

04202E
28042F
2F1204
0B2F04

Contrast Matrix WCAG 2.1 Contrast

04202E
65490A
837143
AC8F41
E2D090
—
2.0
Fail
3.5
AA Large
5.4
AA
10.9
AAA
2.0
Fail
—
1.8
Fail
2.7
Fail
5.4
AA
3.5
AA Large
1.8
Fail
—
1.5
Fail
3.1
AA Large
5.4
AA
2.7
Fail
1.5
Fail
—
2.0
Fail
10.9
AAA
5.4
AA
3.1
AA Large
2.0
Fail
—
White BG
16.8AAA
8.4AAA
4.8AA
3.1AA Large
1.5Fail
Black BG
1.3Fail
2.5Fail
4.4AA Large
6.8AA
13.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

10102B
595919
7B7B4E
9F9F54
DADA9F

Deuteranopia

0F0C2A
5B5D1D
7C7E51
A1A358
DBDDA3

Tritanopia

052827
642528
825759
AB6366
E1ACAE

Achromatopsia

191919
4A4A4A
717171
8F8F8F
CECECE

Shades & Tints Shades & Tints

#04202E

Dark
Light

#65490A

Dark
Light

#837143

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #04202e;
  --color-2: #65490a;
  --color-3: #837143;
  --color-4: #ac8f41;
  --color-5: #e2d090;
}

SCSS

$color-1: #04202e;
$color-2: #65490a;
$color-3: #837143;
$color-4: #ac8f41;
$color-5: #e2d090;

TAILWIND

colors: {
  'brand-1': '#04202e',
  'brand-2': '#65490a',
  'brand-3': '#837143',
  'brand-4': '#ac8f41',
  'brand-5': '#e2d090',
}

RGB Array

[4, 32, 46], [101, 73, 10], [131, 113, 67], [172, 143, 65], [226, 208, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #04202E, #65490A, #837143, #AC8F41, #E2D090 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #04202e; --color-2: #65490a; --color-3: #837143; --color-4: #ac8f41; --color-5: #e2d090. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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