← Back to Editor

#3E2D23 · #9A7467 · #C8895D · #E67030 · #FFD4AC

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

#3E2D23

Tangerine · DarkSlateGray · Cinnamon

HEX
#3E2D23
RGB
rgb(62, 45, 35)
HSL
hsl(22, 28%, 19%)
HSB
hsb(22, 44%, 24%)
CMYK
cmyk(0%, 27%, 44%, 76%)
Oklch
oklch(31.4% 0.031 51.7)

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

#9A7467

Tangerine · Gray · Amber Brown

HEX
#9A7467
RGB
rgb(154, 116, 103)
HSL
hsl(15, 20%, 50%)
HSB
hsb(15, 33%, 60%)
CMYK
cmyk(0%, 25%, 33%, 40%)
Oklch
oklch(59.3% 0.052 39.7)

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

#C8895D

Tangerine · DarkSalmon · Warm Sun

HEX
#C8895D
RGB
rgb(200, 137, 93)
HSL
hsl(25, 49%, 57%)
HSB
hsb(25, 54%, 78%)
CMYK
cmyk(0%, 32%, 53%, 22%)
Oklch
oklch(68.4% 0.097 55.2)

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

#E67030

Tangerine · Chocolate · Warm Sun

HEX
#E67030
RGB
rgb(230, 112, 48)
HSL
hsl(21, 78%, 55%)
HSB
hsb(21, 79%, 90%)
CMYK
cmyk(0%, 51%, 79%, 10%)
Oklch
oklch(67.5% 0.165 45.9)

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

#FFD4AC

Apricot · Wheat · Peach Orange

HEX
#FFD4AC
RGB
rgb(255, 212, 172)
HSL
hsl(29, 100%, 84%)
HSB
hsb(29, 33%, 100%)
CMYK
cmyk(0%, 17%, 33%, 0%)
Oklch
oklch(89.7% 0.071 64.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

3E2D23
23343E

Analogous

3E2327
3E2D23
3E3A23

Triadic

3E2D23
233E2D
2D233E

Split-Comp.

3E2D23
233E3A
23273E

Tetradic

3E2D23
273E23
23343E
3A233E

Contrast Matrix WCAG 2.1 Contrast

3E2D23
9A7467
C8895D
E67030
FFD4AC
—
3.2
AA Large
4.5
AA Large
4.2
AA Large
9.5
AAA
3.2
AA Large
—
1.4
Fail
1.3
Fail
3.0
AA Large
4.5
AA Large
1.4
Fail
—
1.1
Fail
2.1
Fail
4.2
AA Large
1.3
Fail
1.1
Fail
—
2.3
Fail
9.5
AAA
3.0
AA Large
2.1
Fail
2.3
Fail
—
White BG
13.1AAA
4.1AA Large
2.9Fail
3.1AA Large
1.4Fail
Black BG
1.6Fail
5.1AA
7.2AAA
6.7AA
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

373625
8A896A
ADAC68
B3B23F
ECECB6

Deuteranopia

383926
8C8F6B
B0B56A
BAC343
EFF2B8

Tritanopia

3D2728
986D6D
C57072
E04C4E
FDBDBF

Achromatopsia

313131
7E7E7E
979797
8C8C8C
DCDCDC

Shades & Tints Shades & Tints

#3E2D23

Dark
Light

#9A7467

Dark
Light

#C8895D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #3e2d23;
  --color-2: #9a7467;
  --color-3: #c8895d;
  --color-4: #e67030;
  --color-5: #ffd4ac;
}

SCSS

$color-1: #3e2d23;
$color-2: #9a7467;
$color-3: #c8895d;
$color-4: #e67030;
$color-5: #ffd4ac;

TAILWIND

colors: {
  'brand-1': '#3e2d23',
  'brand-2': '#9a7467',
  'brand-3': '#c8895d',
  'brand-4': '#e67030',
  'brand-5': '#ffd4ac',
}

RGB Array

[62, 45, 35], [154, 116, 103], [200, 137, 93], [230, 112, 48], [255, 212, 172]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #3E2D23, #9A7467, #C8895D, #E67030, #FFD4AC 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: #3e2d23; --color-2: #9a7467; --color-3: #c8895d; --color-4: #e67030; --color-5: #ffd4ac. 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