#D5B7AF + #F3DDD2 + #FFECE3 + #D1C5D9 + #B4A4BE · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#D5B7AF

Peach Pink · Silver · Coral Red

HEX

#D5B7AF

RGB

rgb(213, 183, 175)

HSL

hsl(13, 31%, 76%)

HSB

hsb(13, 18%, 84%)

CMYK

cmyk(0%, 14%, 18%, 16%)

Oklch

oklch(80.3% 0.036 35.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F3DDD2

Apricot · Bisque · Peach Orange

HEX

#F3DDD2

RGB

rgb(243, 221, 210)

HSL

hsl(20, 58%, 89%)

HSB

hsb(20, 14%, 95%)

CMYK

cmyk(0%, 9%, 14%, 5%)

Oklch

oklch(91.2% 0.029 48.4)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#FFECE3

Apricot · Linen · Peach Orange

HEX

#FFECE3

RGB

rgb(255, 236, 227)

HSL

hsl(19, 100%, 95%)

HSB

hsb(19, 11%, 100%)

CMYK

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

Oklch

oklch(95.6% 0.024 47.1)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#D1C5D9

Lilac · LightGray · Lavender

HEX

#D1C5D9

RGB

rgb(209, 197, 217)

HSL

hsl(276, 21%, 81%)

HSB

hsb(276, 9%, 85%)

CMYK

cmyk(4%, 9%, 0%, 15%)

Oklch

oklch(83.9% 0.030 312.1)

Traditional「Lilac」· Paint「Lavender」· Creative Lavender Dream

#B4A4BE

Lilac · DarkGray · Lilac Purple

HEX

#B4A4BE

RGB

rgb(180, 164, 190)

HSL

hsl(277, 17%, 69%)

HSB

hsb(277, 14%, 75%)

CMYK

cmyk(5%, 14%, 0%, 25%)

Oklch

oklch(74.1% 0.041 312.6)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D5B7AF

AFCDD5

Analogous

D5AFBA

D5B7AF

D5CAAF

Triadic

D5B7AF

AFD5B7

B7AFD5

Split-Comp.

D5B7AF

AFD5CA

AFBAD5

Tetradic

D5B7AF

BAD5AF

AFCDD5

CAAFD5

Contrast Matrix WCAG 2.1 Contrast

D5B7AF	F3DDD2	FFECE3	D1C5D9	B4A4BE
—	1.4 Fail	1.6 Fail	1.1 Fail	1.2 Fail
1.4 Fail	—	1.1 Fail	1.3 Fail	1.8 Fail
1.6 Fail	1.1 Fail	—	1.4 Fail	2.0 Fail
1.1 Fail	1.3 Fail	1.4 Fail	—	1.4 Fail
1.2 Fail	1.8 Fail	2.0 Fail	1.4 Fail	—

White BG

1.9Fail

1.3Fail

1.1Fail

1.7Fail

2.3Fail

Black BG

11.2AAA

16.1AAA

18.4AAA

12.7AAA

9.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C8B1

E9E9D5

F7F7E5

CCCCD4

ADADB8

Deuteranopia

CACCB1

EBECD5

F8F9E6

CDCDD3

AEAFB6

Tritanopia

D4B2B3

F2D7D7

FEE7E7

D0D0D0

B3B3B2

Achromatopsia

BFBFBF

E2E2E2

F1F1F1

CBCBCB

ACACAC

Shades & Tints Shades & Tints

#D5B7AF

Dark

Light

#F3DDD2

Dark

Light

#FFECE3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d5b7af;
  --color-2: #f3ddd2;
  --color-3: #ffece3;
  --color-4: #d1c5d9;
  --color-5: #b4a4be;
}

SCSS

$color-1: #d5b7af;
$color-2: #f3ddd2;
$color-3: #ffece3;
$color-4: #d1c5d9;
$color-5: #b4a4be;

TAILWIND

colors: {
  'brand-1': '#d5b7af',
  'brand-2': '#f3ddd2',
  'brand-3': '#ffece3',
  'brand-4': '#d1c5d9',
  'brand-5': '#b4a4be',
}

RGB Array

[213, 183, 175], [243, 221, 210], [255, 236, 227], [209, 197, 217], [180, 164, 190]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #D5B7AF, #F3DDD2, #FFECE3, #D1C5D9, #B4A4BE 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: #d5b7af; --color-2: #f3ddd2; --color-3: #ffece3; --color-4: #d1c5d9; --color-5: #b4a4be. 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