#98D4DC + #CCEAEE + #ECDEE3 + #FAC2CE + #F5859D · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarmCool

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#98D4DC

Sky Blue · SkyBlue · Lake Green

HEX

#98D4DC

RGB

rgb(152, 212, 220)

HSL

hsl(187, 49%, 73%)

HSB

hsb(187, 31%, 86%)

CMYK

cmyk(31%, 4%, 0%, 14%)

Oklch

oklch(83.2% 0.062 206.4)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#CCEAEE

Sky Blue · Lavender · Glacier Blue

HEX

#CCEAEE

RGB

rgb(204, 234, 238)

HSL

hsl(187, 50%, 87%)

HSB

hsb(187, 14%, 93%)

CMYK

cmyk(14%, 2%, 0%, 7%)

Oklch

oklch(91.7% 0.032 206.4)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

#ECDEE3

Rouge · Linen · Cherry Blossom

HEX

#ECDEE3

RGB

rgb(236, 222, 227)

HSL

hsl(339, 27%, 90%)

HSB

hsb(339, 6%, 93%)

CMYK

cmyk(0%, 6%, 4%, 7%)

Oklch

oklch(91.3% 0.017 353.7)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#FAC2CE

Peach Pink · Pink · Cherry Blossom

HEX

#FAC2CE

RGB

rgb(250, 194, 206)

HSL

hsl(347, 85%, 87%)

HSB

hsb(347, 22%, 98%)

CMYK

cmyk(0%, 22%, 18%, 2%)

Oklch

oklch(86.7% 0.066 4.2)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#F5859D

Peach Pink · LightCoral · Coral Red

HEX

#F5859D

RGB

rgb(245, 133, 157)

HSL

hsl(347, 85%, 74%)

HSB

hsb(347, 46%, 96%)

CMYK

cmyk(0%, 46%, 36%, 4%)

Oklch

oklch(74.6% 0.138 7.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98D4DC

DCA098

Analogous

98DCC2

98D4DC

98B2DC

Triadic

98D4DC

DC98D4

D4DC98

Split-Comp.

98D4DC

DC98B2

DCC298

Tetradic

98D4DC

C298DC

DCA098

B2DC98

Contrast Matrix WCAG 2.1 Contrast

98D4DC	CCEAEE	ECDEE3	FAC2CE	F5859D
—	1.3 Fail	1.3 Fail	1.1 Fail	1.5 Fail
1.3 Fail	—	1.0 Fail	1.2 Fail	1.9 Fail
1.3 Fail	1.0 Fail	—	1.2 Fail	1.8 Fail
1.1 Fail	1.2 Fail	1.2 Fail	—	1.6 Fail
1.5 Fail	1.9 Fail	1.8 Fail	1.6 Fail	—

White BG

1.6Fail

1.3Fail

1.5Fail

2.4Fail

Black BG

12.8AAA

16.6AAA

16.1AAA

13.7AAA

8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B2B3DA

D9D9ED

E6E6E2

E2E1CB

C5C397

Deuteranopia

AFAADA

D7D5ED

E7E8E1

E5E9CA

CBD396

Tritanopia

9BD9D8

CDECEC

EBE1E1

F7C9C8

EF9392

Achromatopsia

C3C3C3

E1E1E1

E3E3E3

D4D4D4

A9A9A9

Shades & Tints Shades & Tints

#98D4DC

Dark

Light

#CCEAEE

Dark

Light

#ECDEE3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98d4dc;
  --color-2: #cceaee;
  --color-3: #ecdee3;
  --color-4: #fac2ce;
  --color-5: #f5859d;
}

SCSS

$color-1: #98d4dc;
$color-2: #cceaee;
$color-3: #ecdee3;
$color-4: #fac2ce;
$color-5: #f5859d;

TAILWIND

colors: {
  'brand-1': '#98d4dc',
  'brand-2': '#cceaee',
  'brand-3': '#ecdee3',
  'brand-4': '#fac2ce',
  'brand-5': '#f5859d',
}

RGB Array

[152, 212, 220], [204, 234, 238], [236, 222, 227], [250, 194, 206], [245, 133, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #98D4DC, #CCEAEE, #ECDEE3, #FAC2CE, #F5859D 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: #98d4dc; --color-2: #cceaee; --color-3: #ecdee3; --color-4: #fac2ce; --color-5: #f5859d. 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