← Back to Editor

#CADEE2 · #DBE8D6 · #EBF2CA · #FCFCBE · #F0F0D8

pastel

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#CADEE2

Sky Blue · LightGray · Glacier Blue

HEX
#CADEE2
RGB
rgb(202, 222, 226)
HSL
hsl(190, 29%, 84%)
HSB
hsb(190, 11%, 89%)
CMYK
cmyk(11%, 2%, 0%, 11%)
Oklch
oklch(88.7% 0.022 211.0)

TraditionalSky Blue」· PaintGlacier Blue」· Creative Arctic Pool

#DBE8D6

Celadon · LightGray · Mint Green

HEX
#DBE8D6
RGB
rgb(219, 232, 214)
HSL
hsl(103, 28%, 87%)
HSB
hsb(103, 8%, 91%)
CMYK
cmyk(6%, 0%, 8%, 9%)
Oklch
oklch(91.6% 0.028 136.9)

TraditionalCeladon」· PaintMint Green」· Creative Mint Breeze

#EBF2CA

Willow Green · Beige · Mint Green

HEX
#EBF2CA
RGB
rgb(235, 242, 202)
HSL
hsl(71, 61%, 87%)
HSB
hsb(71, 17%, 95%)
CMYK
cmyk(3%, 0%, 17%, 5%)
Oklch
oklch(94.6% 0.053 115.5)

TraditionalWillow Green」· PaintMint Green」· Creative Mint Breeze

#FCFCBE

Fresh Green · Bisque · Lemon Cream

HEX
#FCFCBE
RGB
rgb(252, 252, 190)
HSL
hsl(60, 91%, 87%)
HSB
hsb(60, 25%, 99%)
CMYK
cmyk(0%, 0%, 25%, 1%)
Oklch
oklch(97.6% 0.079 107.8)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

#F0F0D8

Fresh Green · Beige · Lemon Cream

HEX
#F0F0D8
RGB
rgb(240, 240, 216)
HSL
hsl(60, 44%, 89%)
HSB
hsb(60, 10%, 94%)
CMYK
cmyk(0%, 0%, 10%, 6%)
Oklch
oklch(94.9% 0.032 107.0)

TraditionalFresh Green」· PaintLemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CADEE2
E2CECA

Analogous

CAE2DA
CADEE2
CAD2E2

Triadic

CADEE2
E2CADE
DEE2CA

Split-Comp.

CADEE2
E2CAD2
E2DACA

Tetradic

CADEE2
DACAE2
E2CECA
D2E2CA

Contrast Matrix WCAG 2.1 Contrast

CADEE2
DBE8D6
EBF2CA
FCFCBE
F0F0D8
1.1
Fail
1.2
Fail
1.3
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.3
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
1.1
Fail
White BG
1.4Fail
1.3Fail
1.2Fail
1.1Fail
1.2Fail
Black BG
15.1AAA
16.5AAA
18.1AAA
19.8AAA
18.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D3D3E1
E1E1DA
EEEED4
FCFCCD
F0F0DE

Deuteranopia

D2D0E1
E0DFDB
EEEDD6
FCFCD1
F0F0DF

Tritanopia

CBE0E0
DCDEDF
EBDBDD
FCD9DB
F0E2E3

Achromatopsia

D8D8D8
E2E2E2
EBEBEB
F5F5F5
EDEDED

Shades & Tints Shades & Tints

#CADEE2

Dark
Light

#DBE8D6

Dark
Light

#EBF2CA

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cadee2;
  --color-2: #dbe8d6;
  --color-3: #ebf2ca;
  --color-4: #fcfcbe;
  --color-5: #f0f0d8;
}

SCSS

$color-1: #cadee2;
$color-2: #dbe8d6;
$color-3: #ebf2ca;
$color-4: #fcfcbe;
$color-5: #f0f0d8;

TAILWIND

colors: {
  'brand-1': '#cadee2',
  'brand-2': '#dbe8d6',
  'brand-3': '#ebf2ca',
  'brand-4': '#fcfcbe',
  'brand-5': '#f0f0d8',
}

RGB Array

[202, 222, 226], [219, 232, 214], [235, 242, 202], [252, 252, 190], [240, 240, 216]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #CADEE2, #DBE8D6, #EBF2CA, #FCFCBE, #F0F0D8 is ideal for: health products, baby brands, fresh-style blogs. 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: #cadee2; --color-2: #dbe8d6; --color-3: #ebf2ca; --color-4: #fcfcbe; --color-5: #f0f0d8. 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 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