← Back to Editor

#D2ECB9 · #FFFFFF · #FFF0F7 · #DCE2E2

pastel

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#D2ECB9

Emerald · LightGray · Mint Green

HEX
#D2ECB9
RGB
rgb(210, 236, 185)
HSL
hsl(91, 57%, 83%)
HSB
hsb(91, 22%, 93%)
CMYK
cmyk(11%, 0%, 22%, 7%)
Oklch
oklch(91.1% 0.073 129.8)

TraditionalEmerald」· PaintMint Green」· Creative Mint Breeze

#FFFFFF

Moonlight White · White · Cloud White

HEX
#FFFFFF
RGB
rgb(255, 255, 255)
HSL
hsl(0, 0%, 100%)
HSB
hsb(0, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(100.0% 0.000 89.9)

TraditionalMoonlight White」· PaintCloud White」· Creative Morning Mist

#FFF0F7

Rouge · SeaShell · Cherry Blossom

HEX
#FFF0F7
RGB
rgb(255, 240, 247)
HSL
hsl(332, 100%, 97%)
HSB
hsb(332, 6%, 100%)
CMYK
cmyk(0%, 6%, 3%, 0%)
Oklch
oklch(96.9% 0.019 347.4)

TraditionalRouge」· PaintCherry Blossom」· Creative Rose Petal

#DCE2E2

Sky Blue · LightGray · Cloud White

HEX
#DCE2E2
RGB
rgb(220, 226, 226)
HSL
hsl(180, 9%, 87%)
HSB
hsb(180, 3%, 89%)
CMYK
cmyk(3%, 0%, 0%, 11%)
Oklch
oklch(90.8% 0.006 197.0)

TraditionalSky Blue」· PaintCloud White」· Creative Silver Lining

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2ECB9
D4BBEC

Analogous

ECECBB
D2ECB9
BBECBC

Triadic

D2ECB9
BBD3EC
ECBBD3

Split-Comp.

D2ECB9
BCBBEC
ECBBEC

Tetradic

D2ECB9
BBECEC
D4BBEC
ECBCBB

Contrast Matrix WCAG 2.1 Contrast

D2ECB9
FFFFFF
FFF0F7
DCE2E2
1.3
Fail
1.2
Fail
1.0
Fail
1.3
Fail
1.1
Fail
1.3
Fail
1.2
Fail
1.1
Fail
1.2
Fail
1.0
Fail
1.3
Fail
1.2
Fail
White BG
1.3Fail
1.0Fail
1.1Fail
1.3Fail
Black BG
16.4AAA
21.0AAA
19.1AAA
16.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DDDDC5
FFFFFF
F9F8F5
DFDFE2

Deuteranopia

DCDAC8
FFFFFF
F9FBF5
DEDEE2

Tritanopia

D3CFD1
FFFFFF
FEF4F4
DCE2E2

Achromatopsia

DEDEDE
FFFFFF
F5F5F5
E0E0E0

Shades & Tints Shades & Tints

#D2ECB9

Dark
Light

#FFFFFF

Dark
Light

#FFF0F7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2ecb9;
  --color-2: #ffffff;
  --color-3: #fff0f7;
  --color-4: #dce2e2;
}

SCSS

$color-1: #d2ecb9;
$color-2: #ffffff;
$color-3: #fff0f7;
$color-4: #dce2e2;

TAILWIND

colors: {
  'brand-1': '#d2ecb9',
  'brand-2': '#ffffff',
  'brand-3': '#fff0f7',
  'brand-4': '#dce2e2',
}

RGB Array

[210, 236, 185], [255, 255, 255], [255, 240, 247], [220, 226, 226]

FAQ FAQ

What scenarios is this 4-color palette suitable for?

This pastel-style palette of #D2ECB9, #FFFFFF, #FFF0F7, #DCE2E2 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: #d2ecb9; --color-2: #ffffff; --color-3: #fff0f7; --color-4: #dce2e2. 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 pastel-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