← Back to Editor

#DCE3B7 · #A19A87 · #BBD502 · #D5FC00 · #233340

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 LibraryData Visualization

Color Details Color Details

#DCE3B7

Willow Green · Wheat · Apple Green

HEX
#DCE3B7
RGB
rgb(220, 227, 183)
HSL
hsl(70, 44%, 80%)
HSB
hsb(70, 19%, 89%)
CMYK
cmyk(3%, 0%, 19%, 11%)
Oklch
oklch(89.9% 0.059 114.9)

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

#A19A87

Ginger · DarkGray · Sunflower

HEX
#A19A87
RGB
rgb(161, 154, 135)
HSL
hsl(44, 12%, 58%)
HSB
hsb(44, 16%, 63%)
CMYK
cmyk(0%, 4%, 16%, 37%)
Oklch
oklch(68.7% 0.028 90.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#BBD502

Autumn Sage · GreenYellow · Honey Gold

HEX
#BBD502
RGB
rgb(187, 213, 2)
HSL
hsl(67, 98%, 42%)
HSB
hsb(67, 99%, 84%)
CMYK
cmyk(12%, 0%, 99%, 16%)
Oklch
oklch(82.5% 0.192 118.2)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#D5FC00

Autumn Sage · Yellow · Honey Gold

HEX
#D5FC00
RGB
rgb(213, 252, 0)
HSL
hsl(69, 100%, 49%)
HSB
hsb(69, 100%, 99%)
CMYK
cmyk(15%, 0%, 100%, 1%)
Oklch
oklch(93.0% 0.222 120.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#233340

Slate Blue · DarkSlateGray · Deep Sea Blue

HEX
#233340
RGB
rgb(35, 51, 64)
HSL
hsl(207, 29%, 19%)
HSB
hsb(207, 45%, 25%)
CMYK
cmyk(45%, 20%, 0%, 75%)
Oklch
oklch(31.3% 0.032 243.5)

Traditional「Slate Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DCE3B7
BDB6E2

Analogous

E2D3B6
DCE3B7
C5E2B6

Triadic

DCE3B7
B6DBE2
E2B6DB

Split-Comp.

DCE3B7
B6C5E2
D3B6E2

Tetradic

DCE3B7
B6E2D3
BDB6E2
E2B6C5

Contrast Matrix WCAG 2.1 Contrast

DCE3B7
A19A87
BBD502
D5FC00
233340
—
2.1
Fail
1.2
Fail
1.1
Fail
9.7
AAA
2.1
Fail
—
1.7
Fail
2.4
Fail
4.6
AA
1.2
Fail
1.7
Fail
—
1.4
Fail
7.8
AAA
1.1
Fail
2.4
Fail
1.4
Fail
—
11.0
AAA
9.7
AAA
4.6
AA
7.8
AAA
11.0
AAA
—
White BG
1.3Fail
2.8Fail
1.7Fail
1.2Fail
13.0AAA
Black BG
15.7AAA
7.5AAA
12.6AAA
17.8AAA
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DFDFC2
9E9E8C
C6C635
E6E63D
2A2A3D

Deuteranopia

DFDEC4
9E9F8D
C5C341
E4E14C
29283C

Tritanopia

DCCACC
A18F90
BC5D66
D76D78
243A3A

Achromatopsia

DCDCDC
9A9A9A
B5B5B5
D4D4D4
303030

Shades & Tints Shades & Tints

#DCE3B7

Dark
Light

#A19A87

Dark
Light

#BBD502

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dce3b7;
  --color-2: #a19a87;
  --color-3: #bbd502;
  --color-4: #d5fc00;
  --color-5: #233340;
}

SCSS

$color-1: #dce3b7;
$color-2: #a19a87;
$color-3: #bbd502;
$color-4: #d5fc00;
$color-5: #233340;

TAILWIND

colors: {
  'brand-1': '#dce3b7',
  'brand-2': '#a19a87',
  'brand-3': '#bbd502',
  'brand-4': '#d5fc00',
  'brand-5': '#233340',
}

RGB Array

[220, 227, 183], [161, 154, 135], [187, 213, 2], [213, 252, 0], [35, 51, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DCE3B7, #A19A87, #BBD502, #D5FC00, #233340 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: #dce3b7; --color-2: #a19a87; --color-3: #bbd502; --color-4: #d5fc00; --color-5: #233340. 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