← Back to Editor

#D5C089 · #705A28 · #211602 · #B14300 · #D97808

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

#D5C089

Ginger · BurlyWood · Sunflower

HEX
#D5C089
RGB
rgb(213, 192, 137)
HSL
hsl(43, 48%, 69%)
HSB
hsb(43, 36%, 84%)
CMYK
cmyk(0%, 10%, 36%, 16%)
Oklch
oklch(81.2% 0.076 89.5)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#705A28

Ochre · DarkOliveGreen · Honey Gold

HEX
#705A28
RGB
rgb(112, 90, 40)
HSL
hsl(42, 47%, 30%)
HSB
hsb(42, 64%, 44%)
CMYK
cmyk(0%, 20%, 64%, 56%)
Oklch
oklch(47.9% 0.074 85.5)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#211602

Ochre · Black · Cinnamon

HEX
#211602
RGB
rgb(33, 22, 2)
HSL
hsl(39, 89%, 7%)
HSB
hsb(39, 94%, 13%)
CMYK
cmyk(0%, 33%, 94%, 87%)
Oklch
oklch(20.9% 0.039 81.8)

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

#B14300

Tangerine · FireBrick · Amber Brown

HEX
#B14300
RGB
rgb(177, 67, 0)
HSL
hsl(23, 100%, 35%)
HSB
hsb(23, 100%, 69%)
CMYK
cmyk(0%, 62%, 100%, 31%)
Oklch
oklch(52.7% 0.156 42.9)

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

#D97808

Ochre · Chocolate · Amber Brown

HEX
#D97808
RGB
rgb(217, 120, 8)
HSL
hsl(32, 93%, 44%)
HSB
hsb(32, 96%, 85%)
CMYK
cmyk(0%, 45%, 96%, 15%)
Oklch
oklch(66.8% 0.157 58.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5C089
8AA0D6

Analogous

D69A8A
D5C089
C5D68A

Triadic

D5C089
8AD6C0
C08AD6

Split-Comp.

D5C089
8AC5D6
9A8AD6

Tetradic

D5C089
8AD69A
8AA0D6
D68AC5

Contrast Matrix WCAG 2.1 Contrast

D5C089
705A28
211602
B14300
D97808
—
3.7
AA Large
9.9
AAA
3.2
AA Large
1.8
Fail
3.7
AA Large
—
2.7
Fail
1.2
Fail
2.1
Fail
9.9
AAA
2.7
Fail
—
3.1
AA Large
5.6
AA
3.2
AA Large
1.2
Fail
3.1
AA Large
—
1.8
Fail
1.8
Fail
2.1
Fail
5.6
AA
1.8
Fail
—
White BG
1.8Fail
6.6AA
17.8AAA
5.7AA
3.2AA Large
Black BG
11.7AAA
3.2AA Large
1.2Fail
3.7AA Large
6.6AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC96
666634
1C1C07
818010
AFAE23

Deuteranopia

CDCF9A
686937
1D1E08
889014
B5BC2A

Tritanopia

D4A1A3
6F3E40
200B0C
AC1D20
D4383D

Achromatopsia

C0C0C0
5B5B5B
171717
5C5C5C
888888

Shades & Tints Shades & Tints

#D5C089

Dark
Light

#705A28

Dark
Light

#211602

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5c089;
  --color-2: #705a28;
  --color-3: #211602;
  --color-4: #b14300;
  --color-5: #d97808;
}

SCSS

$color-1: #d5c089;
$color-2: #705a28;
$color-3: #211602;
$color-4: #b14300;
$color-5: #d97808;

TAILWIND

colors: {
  'brand-1': '#d5c089',
  'brand-2': '#705a28',
  'brand-3': '#211602',
  'brand-4': '#b14300',
  'brand-5': '#d97808',
}

RGB Array

[213, 192, 137], [112, 90, 40], [33, 22, 2], [177, 67, 0], [217, 120, 8]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D5C089, #705A28, #211602, #B14300, #D97808 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: #d5c089; --color-2: #705a28; --color-3: #211602; --color-4: #b14300; --color-5: #d97808. 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