#EDAFB3 + #FFCCCC + #F7F7FB + #D3DFE3 + #9BACD0 · 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

#EDAFB3

Peach Pink · LightPink · Cherry Blossom

HEX

#EDAFB3

RGB

rgb(237, 175, 179)

HSL

hsl(356, 63%, 81%)

HSB

hsb(356, 26%, 93%)

CMYK

cmyk(0%, 26%, 24%, 7%)

Oklch

oklch(81.3% 0.073 14.5)

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

#FFCCCC

Peach Pink · Pink · Cherry Blossom

HEX

#FFCCCC

RGB

rgb(255, 204, 204)

HSL

hsl(0, 100%, 90%)

HSB

hsb(0, 20%, 100%)

CMYK

cmyk(0%, 20%, 20%, 0%)

Oklch

oklch(89.0% 0.058 18.3)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#F7F7FB

Wisteria · Snow · Sky Blue

HEX

#F7F7FB

RGB

rgb(247, 247, 251)

HSL

hsl(240, 33%, 98%)

HSB

hsb(240, 2%, 98%)

CMYK

cmyk(2%, 2%, 0%, 2%)

Oklch

oklch(97.7% 0.005 286.3)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#D3DFE3

Sky Blue · LightGray · Glacier Blue

HEX

#D3DFE3

RGB

rgb(211, 223, 227)

HSL

hsl(195, 22%, 86%)

HSB

hsb(195, 7%, 89%)

CMYK

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

Oklch

oklch(89.6% 0.014 219.6)

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

#9BACD0

Azure · LightSteelBlue · Cobalt Blue

HEX

#9BACD0

RGB

rgb(155, 172, 208)

HSL

hsl(221, 36%, 71%)

HSB

hsb(221, 25%, 82%)

CMYK

cmyk(25%, 17%, 0%, 18%)

Oklch

oklch(74.4% 0.056 265.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EDAFB3

B0EDE9

Analogous

EDB0D3

EDAFB3

EDCAB0

Triadic

EDAFB3

B4EDB0

B0B4ED

Split-Comp.

EDAFB3

B0EDCA

B0D3ED

Tetradic

EDAFB3

D3EDB0

B0EDE9

CAB0ED

Contrast Matrix WCAG 2.1 Contrast

EDAFB3	FFCCCC	F7F7FB	D3DFE3	9BACD0
—	1.3 Fail	1.7 Fail	1.4 Fail	1.2 Fail
1.3 Fail	—	1.3 Fail	1.0 Fail	1.6 Fail
1.7 Fail	1.3 Fail	—	1.3 Fail	2.1 Fail
1.4 Fail	1.0 Fail	1.3 Fail	—	1.7 Fail
1.2 Fail	1.6 Fail	2.1 Fail	1.7 Fail	—

White BG

1.8Fail

1.4Fail

1.1Fail

1.4Fail

2.3Fail

Black BG

11.4AAA

14.8AAA

19.7AAA

15.4AAA

9.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D2D2B2

E9E8CC

F7F7FA

D8D8E2

A2A3C7

Deuteranopia

D6DAB2

ECF0CC

F7F7FA

D8D7E2

A1A0C5

Tritanopia

EAB1B1

FCCCCC

F7F9F9

D4E1E1

9CC0BF

Achromatopsia

C2C2C2

DBDBDB

F7F7F7

DCDCDC

ABABAB

Shades & Tints Shades & Tints

#EDAFB3

Dark

Light

#FFCCCC

Dark

Light

#F7F7FB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #edafb3;
  --color-2: #ffcccc;
  --color-3: #f7f7fb;
  --color-4: #d3dfe3;
  --color-5: #9bacd0;
}

SCSS

$color-1: #edafb3;
$color-2: #ffcccc;
$color-3: #f7f7fb;
$color-4: #d3dfe3;
$color-5: #9bacd0;

TAILWIND

colors: {
  'brand-1': '#edafb3',
  'brand-2': '#ffcccc',
  'brand-3': '#f7f7fb',
  'brand-4': '#d3dfe3',
  'brand-5': '#9bacd0',
}

RGB Array

[237, 175, 179], [255, 204, 204], [247, 247, 251], [211, 223, 227], [155, 172, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #EDAFB3, #FFCCCC, #F7F7FB, #D3DFE3, #9BACD0 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: #edafb3; --color-2: #ffcccc; --color-3: #f7f7fb; --color-4: #d3dfe3; --color-5: #9bacd0. 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