← Back to Editor

#D1DECC · #DDE0CC · #E9E2CB · #FF9966

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#D1DECC

Celadon · LightGray · Mint Green

HEX
#D1DECC
RGB
rgb(209, 222, 204)
HSL
hsl(103, 21%, 84%)
HSB
hsb(103, 8%, 87%)
CMYK
cmyk(6%, 0%, 8%, 13%)
Oklch
oklch(88.6% 0.028 136.9)

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

#DDE0CC

Fresh Green · LightGray · Lemon Cream

HEX
#DDE0CC
RGB
rgb(221, 224, 204)
HSL
hsl(69, 24%, 84%)
HSB
hsb(69, 9%, 88%)
CMYK
cmyk(1%, 0%, 9%, 12%)
Oklch
oklch(89.9% 0.027 113.9)

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

#E9E2CB

Goose Yellow · Bisque · Lemon Cream

HEX
#E9E2CB
RGB
rgb(233, 226, 203)
HSL
hsl(46, 41%, 85%)
HSB
hsb(46, 13%, 91%)
CMYK
cmyk(0%, 3%, 13%, 9%)
Oklch
oklch(91.2% 0.032 93.0)

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

#FF9966

Apricot · SandyBrown · Warm Sun

HEX
#FF9966
RGB
rgb(255, 153, 102)
HSL
hsl(20, 100%, 70%)
HSB
hsb(20, 60%, 100%)
CMYK
cmyk(0%, 40%, 60%, 0%)
Oklch
oklch(77.9% 0.139 46.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D1DECC
DACEDF

Analogous

DBDFCE
D1DECC
CEDFD1

Triadic

D1DECC
CED2DF
DFCED2

Split-Comp.

D1DECC
D1CEDF
DFCEDB

Tetradic

D1DECC
CEDBDF
DACEDF
DFD1CE

Contrast Matrix WCAG 2.1 Contrast

D1DECC
DDE0CC
E9E2CB
FF9966
—
1.0
Fail
1.1
Fail
1.5
Fail
1.0
Fail
—
1.0
Fail
1.6
Fail
1.1
Fail
1.0
Fail
—
1.6
Fail
1.5
Fail
1.6
Fail
1.6
Fail
—
White BG
1.4Fail
1.3Fail
1.3Fail
2.1Fail
Black BG
15.0AAA
15.6AAA
16.2AAA
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D7D7D0
DEDED1
E6E6D1
D3D272

Deuteranopia

D6D5D1
DEDED2
E6E7D2
D9E075

Tritanopia

D2D4D5
DDD5D6
E9D5D6
FA7C7E

Achromatopsia

D8D8D8
DDDDDD
E1E1E1
B2B2B2

Shades & Tints Shades & Tints

#D1DECC

Dark
Light

#DDE0CC

Dark
Light

#E9E2CB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d1decc;
  --color-2: #dde0cc;
  --color-3: #e9e2cb;
  --color-4: #ff9966;
}

SCSS

$color-1: #d1decc;
$color-2: #dde0cc;
$color-3: #e9e2cb;
$color-4: #ff9966;

TAILWIND

colors: {
  'brand-1': '#d1decc',
  'brand-2': '#dde0cc',
  'brand-3': '#e9e2cb',
  'brand-4': '#ff9966',
}

RGB Array

[209, 222, 204], [221, 224, 204], [233, 226, 203], [255, 153, 102]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This general-style palette of #D1DECC, #DDE0CC, #E9E2CB, #FF9966 is ideal for: health products, baby brands, fresh-style blogs. It is a balanced and harmonious choice among 4-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #d1decc; --color-2: #dde0cc; --color-3: #e9e2cb; --color-4: #ff9966. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 4-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