← Back to Editor

#DBF7D1 · #CDFADC · #402C30 · #ECE9DF · #101A0C

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

#DBF7D1

Emerald · Beige · Mint Green

HEX
#DBF7D1
RGB
rgb(219, 247, 209)
HSL
hsl(104, 70%, 89%)
HSB
hsb(104, 15%, 97%)
CMYK
cmyk(11%, 0%, 15%, 3%)
Oklch
oklch(94.6% 0.058 137.5)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

#CDFADC

Emerald · Beige · Mint Green

HEX
#CDFADC
RGB
rgb(205, 250, 220)
HSL
hsl(140, 82%, 89%)
HSB
hsb(140, 18%, 98%)
CMYK
cmyk(18%, 0%, 12%, 2%)
Oklch
oklch(94.6% 0.061 155.9)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

#402C30

Crimson · DarkSlateGray · Wine Red

HEX
#402C30
RGB
rgb(64, 44, 48)
HSL
hsl(348, 19%, 21%)
HSB
hsb(348, 31%, 25%)
CMYK
cmyk(0%, 31%, 25%, 75%)
Oklch
oklch(31.8% 0.030 5.7)

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

#ECE9DF

Goose Yellow · Beige · Lemon Cream

HEX
#ECE9DF
RGB
rgb(236, 233, 223)
HSL
hsl(46, 25%, 90%)
HSB
hsb(46, 6%, 93%)
CMYK
cmyk(0%, 1%, 6%, 7%)
Oklch
oklch(93.4% 0.014 93.0)

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

#101A0C

Celadon · Black · Dark Green

HEX
#101A0C
RGB
rgb(16, 26, 12)
HSL
hsl(103, 37%, 7%)
HSB
hsb(103, 54%, 10%)
CMYK
cmyk(38%, 0%, 54%, 90%)
Oklch
oklch(20.3% 0.030 137.1)

Traditional「Celadon」· Paint「Dark Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DBF7D1
ECCFF7

Analogous

EDF7CF
DBF7D1
CFF7D8

Triadic

DBF7D1
CFDAF7
F7CFDA

Split-Comp.

DBF7D1
D8CFF7
F7CFED

Tetradic

DBF7D1
CFEDF7
ECCFF7
F7D8CF

Contrast Matrix WCAG 2.1 Contrast

DBF7D1
CDFADC
402C30
ECE9DF
101A0C
—
1.0
Fail
11.3
AAA
1.1
Fail
15.5
AAA
1.0
Fail
—
11.3
AAA
1.1
Fail
15.6
AAA
11.3
AAA
11.3
AAA
—
10.7
AAA
1.4
Fail
1.1
Fail
1.1
Fail
10.7
AAA
—
14.7
AAA
15.5
AAA
15.6
AAA
1.4
Fail
14.7
AAA
—
White BG
1.2Fail
1.1Fail
13.0AAA
1.2Fail
17.9AAA
Black BG
18.2AAA
18.3AAA
1.6Fail
17.3AAA
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E7E7DA
E0E1E3
37372F
EBEBE1
14140F

Deuteranopia

E6E3DC
DEDBE5
393A2F
EBEBE2
141310

Tritanopia

DCE1E3
CFE9EA
3F2E2E
ECE3E4
111213

Achromatopsia

EAEAEA
E9E9E9
323232
E9E9E9
151515

Shades & Tints Shades & Tints

#DBF7D1

Dark
Light

#CDFADC

Dark
Light

#402C30

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dbf7d1;
  --color-2: #cdfadc;
  --color-3: #402c30;
  --color-4: #ece9df;
  --color-5: #101a0c;
}

SCSS

$color-1: #dbf7d1;
$color-2: #cdfadc;
$color-3: #402c30;
$color-4: #ece9df;
$color-5: #101a0c;

TAILWIND

colors: {
  'brand-1': '#dbf7d1',
  'brand-2': '#cdfadc',
  'brand-3': '#402c30',
  'brand-4': '#ece9df',
  'brand-5': '#101a0c',
}

RGB Array

[219, 247, 209], [205, 250, 220], [64, 44, 48], [236, 233, 223], [16, 26, 12]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DBF7D1, #CDFADC, #402C30, #ECE9DF, #101A0C 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: #dbf7d1; --color-2: #cdfadc; --color-3: #402c30; --color-4: #ece9df; --color-5: #101a0c. 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