#9BBFB3 + #BF9BA3 + #F78E75 + #E9AC7C + #E8C6AC · 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

#9BBFB3

Jade · DarkGray · Lake Green

HEX

#9BBFB3

RGB

rgb(155, 191, 179)

HSL

hsl(160, 22%, 68%)

HSB

hsb(160, 19%, 75%)

CMYK

cmyk(19%, 0%, 6%, 25%)

Oklch

oklch(77.5% 0.042 172.9)

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

#BF9BA3

Peach Pink · DarkGray · Coral Red

HEX

#BF9BA3

RGB

rgb(191, 155, 163)

HSL

hsl(347, 22%, 68%)

HSB

hsb(347, 19%, 75%)

CMYK

cmyk(0%, 19%, 15%, 25%)

Oklch

oklch(72.5% 0.044 3.3)

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

#F78E75

Peach Pink · Salmon · Coral Red

HEX

#F78E75

RGB

rgb(247, 142, 117)

HSL

hsl(12, 89%, 71%)

HSB

hsb(12, 53%, 97%)

CMYK

cmyk(0%, 43%, 53%, 3%)

Oklch

oklch(75.3% 0.133 34.3)

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

#E9AC7C

Apricot · BurlyWood · Warm Sun

HEX

#E9AC7C

RGB

rgb(233, 172, 124)

HSL

hsl(26, 71%, 70%)

HSB

hsb(26, 47%, 91%)

CMYK

cmyk(0%, 26%, 47%, 9%)

Oklch

oklch(79.1% 0.096 59.0)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E8C6AC

Apricot · Wheat · Peach Orange

HEX

#E8C6AC

RGB

rgb(232, 198, 172)

HSL

hsl(26, 57%, 79%)

HSB

hsb(26, 26%, 91%)

CMYK

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

Oklch

oklch(84.9% 0.052 59.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9BBFB3

BF9BA7

Analogous

9BBFA1

9BBFB3

9BB9BF

Triadic

9BBFB3

B39BBF

BFB39B

Split-Comp.

9BBFB3

BF9BB9

BFA19B

Tetradic

9BBFB3

A19BBF

BF9BA7

B9BF9B

Contrast Matrix WCAG 2.1 Contrast

9BBFB3	BF9BA3	F78E75	E9AC7C	E8C6AC
—	1.2 Fail	1.2 Fail	1.0 Fail	1.2 Fail
1.2 Fail	—	1.1 Fail	1.3 Fail	1.6 Fail
1.2 Fail	1.1 Fail	—	1.2 Fail	1.4 Fail
1.0 Fail	1.3 Fail	1.2 Fail	—	1.2 Fail
1.2 Fail	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

2.0Fail

2.5Fail

2.3Fail

2.0Fail

1.6Fail

Black BG

10.5AAA

8.4AAA

9.1AAA

10.7AAA

13.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ABABB6

AFAFA1

CAC97B

CFCE88

D9D9B2

Deuteranopia

A9A6B7

B2B4A1

D0D77D

D2D78A

DBDEB4

Tritanopia

9DB8B9

BDA09F

F28081

E69193

E6B7B8

Achromatopsia

B3B3B3

A7A7A7

ABABAB

B9B9B9

CDCDCD

Shades & Tints Shades & Tints

#9BBFB3

Dark

Light

#BF9BA3

Dark

Light

#F78E75

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9bbfb3;
  --color-2: #bf9ba3;
  --color-3: #f78e75;
  --color-4: #e9ac7c;
  --color-5: #e8c6ac;
}

SCSS

$color-1: #9bbfb3;
$color-2: #bf9ba3;
$color-3: #f78e75;
$color-4: #e9ac7c;
$color-5: #e8c6ac;

TAILWIND

colors: {
  'brand-1': '#9bbfb3',
  'brand-2': '#bf9ba3',
  'brand-3': '#f78e75',
  'brand-4': '#e9ac7c',
  'brand-5': '#e8c6ac',
}

RGB Array

[155, 191, 179], [191, 155, 163], [247, 142, 117], [233, 172, 124], [232, 198, 172]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #9BBFB3, #BF9BA3, #F78E75, #E9AC7C, #E8C6AC 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: #9bbfb3; --color-2: #bf9ba3; --color-3: #f78e75; --color-4: #e9ac7c; --color-5: #e8c6ac. 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