← Back to Editor

#5C4638 · #382715 · #D39C63 · #A7151F · #D18E37

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

#5C4638

Tangerine · DarkOliveGreen · Amber Brown

HEX
#5C4638
RGB
rgb(92, 70, 56)
HSL
hsl(23, 24%, 29%)
HSB
hsb(23, 39%, 36%)
CMYK
cmyk(0%, 24%, 39%, 64%)
Oklch
oklch(41.4% 0.038 53.9)

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

#382715

Ochre · DarkSlateGray · Cinnamon

HEX
#382715
RGB
rgb(56, 39, 21)
HSL
hsl(31, 45%, 15%)
HSB
hsb(31, 63%, 22%)
CMYK
cmyk(0%, 30%, 62%, 78%)
Oklch
oklch(28.8% 0.039 66.8)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#D39C63

Ginger · DarkSalmon · Warm Sun

HEX
#D39C63
RGB
rgb(211, 156, 99)
HSL
hsl(31, 56%, 61%)
HSB
hsb(31, 53%, 83%)
CMYK
cmyk(0%, 26%, 53%, 17%)
Oklch
oklch(73.3% 0.099 66.2)

Traditional「Ginger」· Paint「Warm Sun」· Creative Honey Glow

#A7151F

Vermilion · FireBrick · Wine Red

HEX
#A7151F
RGB
rgb(167, 21, 31)
HSL
hsl(356, 78%, 37%)
HSB
hsb(356, 87%, 65%)
CMYK
cmyk(0%, 87%, 81%, 35%)
Oklch
oklch(46.7% 0.178 25.2)

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

#D18E37

Ginger · GoldenRod · Warm Sun

HEX
#D18E37
RGB
rgb(209, 142, 55)
HSL
hsl(34, 63%, 52%)
HSB
hsb(34, 74%, 82%)
CMYK
cmyk(0%, 32%, 74%, 18%)
Oklch
oklch(69.9% 0.129 69.4)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5C4638
384E5C

Analogous

5C383C
5C4638
5C5838

Triadic

5C4638
385C46
46385C

Split-Comp.

5C4638
385C58
383C5C

Tetradic

5C4638
3C5C38
384E5C
58385C

Contrast Matrix WCAG 2.1 Contrast

5C4638
382715
D39C63
A7151F
D18E37
—
1.6
Fail
3.6
AA Large
1.2
Fail
3.2
AA Large
1.6
Fail
—
5.9
AA
1.9
Fail
5.2
AA
3.6
AA Large
5.9
AA
—
3.1
AA Large
1.1
Fail
1.2
Fail
1.9
Fail
3.1
AA Large
—
2.8
Fail
3.2
AA Large
5.2
AA
1.1
Fail
2.8
Fail
—
White BG
8.8AAA
14.3AAA
2.4Fail
7.6AAA
2.8Fail
Black BG
2.4Fail
1.5Fail
8.7AAA
2.8Fail
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

52523B
313019
BBBB71
68661D
B4B34C

Deuteranopia

54553C
32331A
BEC374
707B1C
B8BD51

Tritanopia

5B3E3F
371D1E
D07C7E
A01B1A
CE5D60

Achromatopsia

4B4B4B
2A2A2A
A6A6A6
424242
989898

Shades & Tints Shades & Tints

#5C4638

Dark
Light

#382715

Dark
Light

#D39C63

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5c4638;
  --color-2: #382715;
  --color-3: #d39c63;
  --color-4: #a7151f;
  --color-5: #d18e37;
}

SCSS

$color-1: #5c4638;
$color-2: #382715;
$color-3: #d39c63;
$color-4: #a7151f;
$color-5: #d18e37;

TAILWIND

colors: {
  'brand-1': '#5c4638',
  'brand-2': '#382715',
  'brand-3': '#d39c63',
  'brand-4': '#a7151f',
  'brand-5': '#d18e37',
}

RGB Array

[92, 70, 56], [56, 39, 21], [211, 156, 99], [167, 21, 31], [209, 142, 55]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5C4638, #382715, #D39C63, #A7151F, #D18E37 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: #5c4638; --color-2: #382715; --color-3: #d39c63; --color-4: #a7151f; --color-5: #d18e37. 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