← Back to Editor

#DBC17E · #E0D4A2 · #DFDCC0 · #B7C4A2 · #30271A

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

#DBC17E

Ginger · BurlyWood · Sunflower

HEX
#DBC17E
RGB
rgb(219, 193, 126)
HSL
hsl(43, 56%, 68%)
HSB
hsb(43, 42%, 86%)
CMYK
cmyk(0%, 12%, 42%, 14%)
Oklch
oklch(81.8% 0.091 89.1)

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

#E0D4A2

Goose Yellow · Wheat · Lemon Cream

HEX
#E0D4A2
RGB
rgb(224, 212, 162)
HSL
hsl(48, 50%, 76%)
HSB
hsb(48, 28%, 88%)
CMYK
cmyk(0%, 5%, 28%, 12%)
Oklch
oklch(86.7% 0.067 96.2)

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

#DFDCC0

Fresh Green · LightGray · Lemon Cream

HEX
#DFDCC0
RGB
rgb(223, 220, 192)
HSL
hsl(54, 33%, 81%)
HSB
hsb(54, 14%, 87%)
CMYK
cmyk(0%, 1%, 14%, 13%)
Oklch
oklch(88.9% 0.037 102.1)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#B7C4A2

Willow Green · DarkGray · Apple Green

HEX
#B7C4A2
RGB
rgb(183, 196, 162)
HSL
hsl(83, 22%, 70%)
HSB
hsb(83, 17%, 77%)
CMYK
cmyk(7%, 0%, 17%, 23%)
Oklch
oklch(80.1% 0.049 124.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#30271A

Ochre · DarkSlateGray · Cinnamon

HEX
#30271A
RGB
rgb(48, 39, 26)
HSL
hsl(35, 30%, 15%)
HSB
hsb(35, 46%, 19%)
CMYK
cmyk(0%, 19%, 46%, 81%)
Oklch
oklch(27.9% 0.026 76.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DBC17E
809ADB

Analogous

DB9480
DBC17E
C7DB80

Triadic

DBC17E
80DBC1
C180DB

Split-Comp.

DBC17E
80C7DB
9480DB

Tetradic

DBC17E
80DB94
809ADB
DB80C7

Contrast Matrix WCAG 2.1 Contrast

DBC17E
E0D4A2
DFDCC0
B7C4A2
30271A
—
1.2
Fail
1.3
Fail
1.0
Fail
8.3
AAA
1.2
Fail
—
1.1
Fail
1.2
Fail
9.9
AAA
1.3
Fail
1.1
Fail
—
1.3
Fail
10.6
AAA
1.0
Fail
1.2
Fail
1.3
Fail
—
8.0
AAA
8.3
AAA
9.9
AAA
10.6
AAA
8.0
AAA
—
White BG
1.8Fail
1.5Fail
1.4Fail
1.8Fail
14.7AAA
Black BG
11.9AAA
14.1AAA
15.1AAA
11.4AAA
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

D0D08E
DBDBAE
DEDEC7
BDBDAA
2C2C1D

Deuteranopia

D1D392
DCDCB1
DEDEC8
BCBBAC
2D2D1E

Tritanopia

DA9B9E
DFB8BA
DFCCCD
B8B1B2
302020

Achromatopsia

C1C1C1
D2D2D2
DADADA
BCBCBC
282828

Shades & Tints Shades & Tints

#DBC17E

Dark
Light

#E0D4A2

Dark
Light

#DFDCC0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dbc17e;
  --color-2: #e0d4a2;
  --color-3: #dfdcc0;
  --color-4: #b7c4a2;
  --color-5: #30271a;
}

SCSS

$color-1: #dbc17e;
$color-2: #e0d4a2;
$color-3: #dfdcc0;
$color-4: #b7c4a2;
$color-5: #30271a;

TAILWIND

colors: {
  'brand-1': '#dbc17e',
  'brand-2': '#e0d4a2',
  'brand-3': '#dfdcc0',
  'brand-4': '#b7c4a2',
  'brand-5': '#30271a',
}

RGB Array

[219, 193, 126], [224, 212, 162], [223, 220, 192], [183, 196, 162], [48, 39, 26]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DBC17E, #E0D4A2, #DFDCC0, #B7C4A2, #30271A 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: #dbc17e; --color-2: #e0d4a2; --color-3: #dfdcc0; --color-4: #b7c4a2; --color-5: #30271a. 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