← Back to Editor

#170603 · #445104 · #B56510 · #720D15 · #E3D98A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#170603

Vermilion · Black · Deep Berry

HEX
#170603
RGB
rgb(23, 6, 3)
HSL
hsl(9, 77%, 5%)
HSB
hsb(9, 87%, 9%)
CMYK
cmyk(0%, 74%, 87%, 91%)
Oklch
oklch(15.1% 0.034 36.4)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#445104

Grass Green · DarkOliveGreen · Dark Green

HEX
#445104
RGB
rgb(68, 81, 4)
HSL
hsl(70, 91%, 17%)
HSB
hsb(70, 95%, 32%)
CMYK
cmyk(16%, 0%, 95%, 68%)
Oklch
oklch(40.9% 0.095 119.9)

Traditional「Grass Green」· Paint「Dark Green」· Creative Blush Sunrise

#B56510

Ochre · Chocolate · Amber Brown

HEX
#B56510
RGB
rgb(181, 101, 16)
HSL
hsl(31, 84%, 39%)
HSB
hsb(31, 91%, 71%)
CMYK
cmyk(0%, 44%, 91%, 29%)
Oklch
oklch(58.7% 0.134 58.9)

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

#720D15

Vermilion · Maroon · Wine Red

HEX
#720D15
RGB
rgb(114, 13, 21)
HSL
hsl(355, 80%, 25%)
HSB
hsb(355, 89%, 45%)
CMYK
cmyk(0%, 89%, 82%, 55%)
Oklch
oklch(35.6% 0.133 24.2)

Traditional「Vermilion」· Paint「Wine Red」· Creative Blush Sunrise

#E3D98A

Fresh Green · Khaki · Sunflower

HEX
#E3D98A
RGB
rgb(227, 217, 138)
HSL
hsl(53, 61%, 72%)
HSB
hsb(53, 39%, 89%)
CMYK
cmyk(0%, 4%, 39%, 11%)
Oklch
oklch(87.6% 0.100 102.0)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

170603
031417

Analogous

17030A
170603
171003

Triadic

170603
031706
060317

Split-Comp.

170603
031710
030A17

Tetradic

170603
0A1703
031417
100317

Contrast Matrix WCAG 2.1 Contrast

170603
445104
B56510
720D15
E3D98A
—
2.3
Fail
4.5
AA
1.7
Fail
13.7
AAA
2.3
Fail
—
2.0
Fail
1.4
Fail
6.0
AA
4.5
AA
2.0
Fail
—
2.7
Fail
3.0
AA Large
1.7
Fail
1.4
Fail
2.7
Fail
—
8.2
AAA
13.7
AAA
6.0
AA
3.0
AA Large
8.2
AAA
—
White BG
19.7AAA
8.7AAA
4.3AA Large
11.8AAA
1.4Fail
Black BG
1.1Fail
2.4Fail
4.8AA
1.8Fail
14.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

100F04
4A4A17
929225
464513
DFDF9D

Deuteranopia

111204
49481B
979D2A
4C5413
DFE0A2

Tritanopia

160404
452529
B13538
6D1211
E2ACB0

Achromatopsia

0B0B0B
444444
737373
2C2C2C
D3D3D3

Shades & Tints Shades & Tints

#170603

Dark
Light

#445104

Dark
Light

#B56510

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #170603;
  --color-2: #445104;
  --color-3: #b56510;
  --color-4: #720d15;
  --color-5: #e3d98a;
}

SCSS

$color-1: #170603;
$color-2: #445104;
$color-3: #b56510;
$color-4: #720d15;
$color-5: #e3d98a;

TAILWIND

colors: {
  'brand-1': '#170603',
  'brand-2': '#445104',
  'brand-3': '#b56510',
  'brand-4': '#720d15',
  'brand-5': '#e3d98a',
}

RGB Array

[23, 6, 3], [68, 81, 4], [181, 101, 16], [114, 13, 21], [227, 217, 138]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #170603, #445104, #B56510, #720D15, #E3D98A 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: #170603; --color-2: #445104; --color-3: #b56510; --color-4: #720d15; --color-5: #e3d98a. 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