← Back to Editor

#DCB56D · #CC6B50 · #9B5D4A · #5F4B44 · #709B90

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DCB56D

Ginger · BurlyWood · Warm Sun

HEX
#DCB56D
RGB
rgb(220, 181, 109)
HSL
hsl(39, 61%, 65%)
HSB
hsb(39, 50%, 86%)
CMYK
cmyk(0%, 18%, 50%, 14%)
Oklch
oklch(79.2% 0.101 81.8)

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

#CC6B50

Crimson · Chocolate · Passion Red

HEX
#CC6B50
RGB
rgb(204, 107, 80)
HSL
hsl(13, 55%, 56%)
HSB
hsb(13, 61%, 80%)
CMYK
cmyk(0%, 48%, 61%, 20%)
Oklch
oklch(63.4% 0.130 36.5)

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

#9B5D4A

Crimson · Sienna · Passion Red

HEX
#9B5D4A
RGB
rgb(155, 93, 74)
HSL
hsl(14, 35%, 45%)
HSB
hsb(14, 52%, 61%)
CMYK
cmyk(0%, 40%, 52%, 39%)
Oklch
oklch(54.4% 0.087 37.8)

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

#5F4B44

Tangerine · DarkOliveGreen · Amber Brown

HEX
#5F4B44
RGB
rgb(95, 75, 68)
HSL
hsl(16, 17%, 32%)
HSB
hsb(16, 28%, 37%)
CMYK
cmyk(0%, 21%, 28%, 63%)
Oklch
oklch(43.2% 0.030 40.2)

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

#709B90

Mineral Blue · LightSlateGray · Lake Green

HEX
#709B90
RGB
rgb(112, 155, 144)
HSL
hsl(165, 18%, 52%)
HSB
hsb(165, 28%, 61%)
CMYK
cmyk(28%, 0%, 7%, 39%)
Oklch
oklch(65.5% 0.050 177.1)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DCB56D
6F95DC

Analogous

DC806F
DCB56D
CCDC6F

Triadic

DCB56D
6FDCB6
B66FDC

Split-Comp.

DCB56D
6FCCDC
806FDC

Tetradic

DCB56D
6FDC80
6F95DC
DC6FCC

Contrast Matrix WCAG 2.1 Contrast

DCB56D
CC6B50
9B5D4A
5F4B44
709B90
—
1.9
Fail
2.7
Fail
4.2
AA Large
1.6
Fail
1.9
Fail
—
1.4
Fail
2.2
Fail
1.2
Fail
2.7
Fail
1.4
Fail
—
1.6
Fail
1.7
Fail
4.2
AA Large
2.2
Fail
1.6
Fail
—
2.6
Fail
1.6
Fail
1.2
Fail
1.7
Fail
2.6
Fail
—
White BG
1.9Fail
3.6AA Large
5.2AA
8.2AAA
3.1AA Large
Black BG
10.9AAA
5.8AA
4.1AA Large
2.6Fail
6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CBCB7E
A2A157
80804F
565646
838393

Deuteranopia

CDD083
A8AF58
848850
585946
807D93

Tritanopia

DA8C8F
C75C5D
985253
5E4747
729595

Achromatopsia

B8B8B8
858585
6D6D6D
505050
8D8D8D

Shades & Tints Shades & Tints

#DCB56D

Dark
Light

#CC6B50

Dark
Light

#9B5D4A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dcb56d;
  --color-2: #cc6b50;
  --color-3: #9b5d4a;
  --color-4: #5f4b44;
  --color-5: #709b90;
}

SCSS

$color-1: #dcb56d;
$color-2: #cc6b50;
$color-3: #9b5d4a;
$color-4: #5f4b44;
$color-5: #709b90;

TAILWIND

colors: {
  'brand-1': '#dcb56d',
  'brand-2': '#cc6b50',
  'brand-3': '#9b5d4a',
  'brand-4': '#5f4b44',
  'brand-5': '#709b90',
}

RGB Array

[220, 181, 109], [204, 107, 80], [155, 93, 74], [95, 75, 68], [112, 155, 144]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DCB56D, #CC6B50, #9B5D4A, #5F4B44, #709B90 is ideal for: corporate websites, product showcases, portfolios. 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: #dcb56d; --color-2: #cc6b50; --color-3: #9b5d4a; --color-4: #5f4b44; --color-5: #709b90. 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. 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