#8FB4A3 + #BDCBB4 + #DBDBBF + #E5D4A9 + #F2877D · 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

#8FB4A3

Jade · DarkSeaGreen · Apple Green

HEX

#8FB4A3

RGB

rgb(143, 180, 163)

HSL

hsl(152, 20%, 63%)

HSB

hsb(152, 21%, 71%)

CMYK

cmyk(21%, 0%, 9%, 29%)

Oklch

oklch(73.8% 0.047 165.4)

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

#BDCBB4

Celadon · Silver · Apple Green

HEX

#BDCBB4

RGB

rgb(189, 203, 180)

HSL

hsl(97, 18%, 75%)

HSB

hsb(97, 11%, 80%)

CMYK

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

Oklch

oklch(82.5% 0.035 133.0)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#DBDBBF

Fresh Green · LightGray · Lemon Cream

HEX

#DBDBBF

RGB

rgb(219, 219, 191)

HSL

hsl(60, 28%, 80%)

HSB

hsb(60, 13%, 86%)

CMYK

cmyk(0%, 0%, 13%, 14%)

Oklch

oklch(88.4% 0.037 107.1)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#E5D4A9

Goose Yellow · Wheat · Lemon Cream

HEX

#E5D4A9

RGB

rgb(229, 212, 169)

HSL

hsl(43, 54%, 78%)

HSB

hsb(43, 26%, 90%)

CMYK

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

Oklch

oklch(87.3% 0.060 89.0)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#F2877D

Peach Pink · LightCoral · Coral Red

HEX

#F2877D

RGB

rgb(242, 135, 125)

HSL

hsl(5, 82%, 72%)

HSB

hsb(5, 48%, 95%)

CMYK

cmyk(0%, 44%, 48%, 5%)

Oklch

oklch(73.7% 0.132 26.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8FB4A3

B48E9F

Analogous

8EB48F

8FB4A3

8EB2B4

Triadic

8FB4A3

A28EB4

B4A28E

Split-Comp.

8FB4A3

B48EB2

B48F8E

Tetradic

8FB4A3

8F8EB4

B48E9F

B2B48E

Contrast Matrix WCAG 2.1 Contrast

8FB4A3	BDCBB4	DBDBBF	E5D4A9	F2877D
—	1.3 Fail	1.6 Fail	1.6 Fail	1.1 Fail
1.3 Fail	—	1.2 Fail	1.2 Fail	1.4 Fail
1.6 Fail	1.2 Fail	—	1.0 Fail	1.7 Fail
1.6 Fail	1.2 Fail	1.0 Fail	—	1.7 Fail
1.1 Fail	1.4 Fail	1.7 Fail	1.7 Fail	—

White BG

2.3Fail

1.7Fail

1.4Fail

1.5Fail

2.5Fail

Black BG

9.2AAA

12.4AAA

14.9AAA

14.3AAA

8.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9FA7

C3C3BA

DBDBC6

DEDDB3

C4C37F

Deuteranopia

9D9AA8

C2C1BB

DBDBC7

DFE0B6

CAD280

Tritanopia

91AAAB

BEBEBF

DBCBCC

E4BCBD

ED8182

Achromatopsia

A7A7A7

C4C4C4

D8D8D8

D4D4D4

A6A6A6

Shades & Tints Shades & Tints

#8FB4A3

Dark

Light

#BDCBB4

Dark

Light

#DBDBBF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8fb4a3;
  --color-2: #bdcbb4;
  --color-3: #dbdbbf;
  --color-4: #e5d4a9;
  --color-5: #f2877d;
}

SCSS

$color-1: #8fb4a3;
$color-2: #bdcbb4;
$color-3: #dbdbbf;
$color-4: #e5d4a9;
$color-5: #f2877d;

TAILWIND

colors: {
  'brand-1': '#8fb4a3',
  'brand-2': '#bdcbb4',
  'brand-3': '#dbdbbf',
  'brand-4': '#e5d4a9',
  'brand-5': '#f2877d',
}

RGB Array

[143, 180, 163], [189, 203, 180], [219, 219, 191], [229, 212, 169], [242, 135, 125]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #8FB4A3, #BDCBB4, #DBDBBF, #E5D4A9, #F2877D 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: #8fb4a3; --color-2: #bdcbb4; --color-3: #dbdbbf; --color-4: #e5d4a9; --color-5: #f2877d. 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