← Back to Editor

#9D8C7C · #302923 · #DF572F · #EB8638 · #EADEC4

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

#9D8C7C

Tangerine · Gray · Warm Sun

HEX
#9D8C7C
RGB
rgb(157, 140, 124)
HSL
hsl(29, 14%, 55%)
HSB
hsb(29, 21%, 62%)
CMYK
cmyk(0%, 11%, 21%, 38%)
Oklch
oklch(65.1% 0.031 65.5)

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

#302923

Tangerine · DarkSlateGray · Cinnamon

HEX
#302923
RGB
rgb(48, 41, 35)
HSL
hsl(28, 16%, 16%)
HSB
hsb(28, 27%, 19%)
CMYK
cmyk(0%, 15%, 27%, 81%)
Oklch
oklch(28.7% 0.015 62.8)

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

#DF572F

Vermilion · Chocolate · Passion Red

HEX
#DF572F
RGB
rgb(223, 87, 47)
HSL
hsl(14, 73%, 53%)
HSB
hsb(14, 79%, 87%)
CMYK
cmyk(0%, 61%, 79%, 13%)
Oklch
oklch(63.0% 0.178 36.7)

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

#EB8638

Tangerine · Coral · Warm Sun

HEX
#EB8638
RGB
rgb(235, 134, 56)
HSL
hsl(26, 82%, 57%)
HSB
hsb(26, 76%, 92%)
CMYK
cmyk(0%, 43%, 76%, 8%)
Oklch
oklch(71.7% 0.152 54.5)

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

#EADEC4

Goose Yellow · Wheat · Lemon Cream

HEX
#EADEC4
RGB
rgb(234, 222, 196)
HSL
hsl(41, 47%, 84%)
HSB
hsb(41, 16%, 92%)
CMYK
cmyk(0%, 5%, 16%, 8%)
Oklch
oklch(90.3% 0.037 86.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9D8C7C
7C8D9C

Analogous

9C7C7D
9D8C7C
9C9C7C

Triadic

9D8C7C
7C9C8C
8C7C9C

Split-Comp.

9D8C7C
7C9C9C
7C7D9C

Tetradic

9D8C7C
7D9C7C
7C8D9C
9C7C9C

Contrast Matrix WCAG 2.1 Contrast

9D8C7C
302923
DF572F
EB8638
EADEC4
—
4.4
AA Large
1.2
Fail
1.2
Fail
2.4
Fail
4.4
AA Large
—
3.8
AA Large
5.5
AA
10.7
AAA
1.2
Fail
3.8
AA Large
—
1.4
Fail
2.8
Fail
1.2
Fail
5.5
AA
1.4
Fail
—
2.0
Fail
2.4
Fail
10.7
AAA
2.8
Fail
2.0
Fail
—
White BG
3.2AA Large
14.3AAA
3.8AA Large
2.6Fail
1.3Fail
Black BG
6.5AA
1.5Fail
5.5AA
8.0AAA
15.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

969580
2D2D24
A4A339
BFBE4B
E5E5CA

Deuteranopia

979881
2D2E25
ACB63B
C5CD4F
E6E6CC

Tritanopia

9C8384
302626
D84042
E65A5D
E9CFD0

Achromatopsia

8F8F8F
2A2A2A
7B7B7B
9B9B9B
DFDFDF

Shades & Tints Shades & Tints

#9D8C7C

Dark
Light

#302923

Dark
Light

#DF572F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9d8c7c;
  --color-2: #302923;
  --color-3: #df572f;
  --color-4: #eb8638;
  --color-5: #eadec4;
}

SCSS

$color-1: #9d8c7c;
$color-2: #302923;
$color-3: #df572f;
$color-4: #eb8638;
$color-5: #eadec4;

TAILWIND

colors: {
  'brand-1': '#9d8c7c',
  'brand-2': '#302923',
  'brand-3': '#df572f',
  'brand-4': '#eb8638',
  'brand-5': '#eadec4',
}

RGB Array

[157, 140, 124], [48, 41, 35], [223, 87, 47], [235, 134, 56], [234, 222, 196]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9D8C7C, #302923, #DF572F, #EB8638, #EADEC4 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: #9d8c7c; --color-2: #302923; --color-3: #df572f; --color-4: #eb8638; --color-5: #eadec4. 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