← Back to Editor

#DDE9E4 · #A9C2B8 · #909BAB · #8289A8 · #7B77A8

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

#DDE9E4

Jade · Lavender · Mint Green

HEX
#DDE9E4
RGB
rgb(221, 233, 228)
HSL
hsl(155, 21%, 89%)
HSB
hsb(155, 5%, 91%)
CMYK
cmyk(5%, 0%, 2%, 9%)
Oklch
oklch(92.4% 0.014 169.2)

Traditional「Jade」· Paint「Mint Green」· Creative Arctic Pool

#A9C2B8

Jade · Silver · Apple Green

HEX
#A9C2B8
RGB
rgb(169, 194, 184)
HSL
hsl(156, 17%, 71%)
HSB
hsb(156, 13%, 76%)
CMYK
cmyk(13%, 0%, 5%, 24%)
Oklch
oklch(79.2% 0.031 169.5)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#909BAB

Azure · DarkGray · Cobalt Blue

HEX
#909BAB
RGB
rgb(144, 155, 171)
HSL
hsl(216, 14%, 62%)
HSB
hsb(216, 16%, 67%)
CMYK
cmyk(16%, 9%, 0%, 33%)
Oklch
oklch(68.6% 0.027 257.7)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#8289A8

Azure · LightSlateGray · Navy Blue

HEX
#8289A8
RGB
rgb(130, 137, 168)
HSL
hsl(229, 18%, 58%)
HSB
hsb(229, 23%, 66%)
CMYK
cmyk(23%, 18%, 0%, 34%)
Oklch
oklch(63.5% 0.047 275.0)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#7B77A8

Deep Indigo · LightSlateGray · Navy Blue

HEX
#7B77A8
RGB
rgb(123, 119, 168)
HSL
hsl(245, 22%, 56%)
HSB
hsb(245, 29%, 66%)
CMYK
cmyk(27%, 29%, 0%, 34%)
Oklch
oklch(59.2% 0.074 287.6)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DDE9E4
E9DDE2

Analogous

DDE9DE
DDE9E4
DDE8E9

Triadic

DDE9E4
E4DDE9
E9E4DD

Split-Comp.

DDE9E4
E9DDE8
E9DEDD

Tetradic

DDE9E4
DEDDE9
E9DDE2
E8E9DD

Contrast Matrix WCAG 2.1 Contrast

DDE9E4
A9C2B8
909BAB
8289A8
7B77A8
—
1.5
Fail
2.3
Fail
2.8
Fail
3.3
AA Large
1.5
Fail
—
1.5
Fail
1.8
Fail
2.2
Fail
2.3
Fail
1.5
Fail
—
1.2
Fail
1.5
Fail
2.8
Fail
1.8
Fail
1.2
Fail
—
1.2
Fail
3.3
AA Large
2.2
Fail
1.5
Fail
1.2
Fail
—
White BG
1.2Fail
1.9Fail
2.8Fail
3.4AA Large
4.2AA Large
Black BG
16.9AAA
11.1AAA
7.5AAA
6.1AA
5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E2E5
B4B4BA
9595A7
8585A0
79799C

Deuteranopia

E2E1E6
B2B1BB
9493A6
85849F
7A7A99

Tritanopia

DEE6E6
AABCBD
91A4A3
829B99
7B9391

Achromatopsia

E5E5E5
B9B9B9
9A9A9A
8A8A8A
7E7E7E

Shades & Tints Shades & Tints

#DDE9E4

Dark
Light

#A9C2B8

Dark
Light

#909BAB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #dde9e4;
  --color-2: #a9c2b8;
  --color-3: #909bab;
  --color-4: #8289a8;
  --color-5: #7b77a8;
}

SCSS

$color-1: #dde9e4;
$color-2: #a9c2b8;
$color-3: #909bab;
$color-4: #8289a8;
$color-5: #7b77a8;

TAILWIND

colors: {
  'brand-1': '#dde9e4',
  'brand-2': '#a9c2b8',
  'brand-3': '#909bab',
  'brand-4': '#8289a8',
  'brand-5': '#7b77a8',
}

RGB Array

[221, 233, 228], [169, 194, 184], [144, 155, 171], [130, 137, 168], [123, 119, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #DDE9E4, #A9C2B8, #909BAB, #8289A8, #7B77A8 is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #dde9e4; --color-2: #a9c2b8; --color-3: #909bab; --color-4: #8289a8; --color-5: #7b77a8. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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