#BFE3E2 + #A9C7C6 + #C89A8C + #D78470 + #E76E53 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#BFE3E2

Jade · LightBlue · Glacier Blue

HEX

#BFE3E2

RGB

rgb(191, 227, 226)

HSL

hsl(178, 39%, 82%)

HSB

hsb(178, 16%, 89%)

CMYK

cmyk(16%, 0%, 0%, 11%)

Oklch

oklch(89.0% 0.038 194.4)

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

#A9C7C6

Jade · Silver · Lake Green

HEX

#A9C7C6

RGB

rgb(169, 199, 198)

HSL

hsl(178, 21%, 72%)

HSB

hsb(178, 15%, 78%)

CMYK

cmyk(15%, 0%, 1%, 22%)

Oklch

oklch(80.7% 0.032 194.1)

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

#C89A8C

Peach Pink · Tan · Coral Red

HEX

#C89A8C

RGB

rgb(200, 154, 140)

HSL

hsl(14, 35%, 67%)

HSB

hsb(14, 30%, 78%)

CMYK

cmyk(0%, 23%, 30%, 22%)

Oklch

oklch(72.5% 0.059 37.6)

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

#D78470

Peach Pink · DarkSalmon · Coral Red

HEX

#D78470

RGB

rgb(215, 132, 112)

HSL

hsl(12, 56%, 64%)

HSB

hsb(12, 48%, 84%)

CMYK

cmyk(0%, 39%, 48%, 16%)

Oklch

oklch(69.6% 0.107 34.3)

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

#E76E53

Peach Pink · Tomato · Coral Red

HEX

#E76E53

RGB

rgb(231, 110, 83)

HSL

hsl(11, 76%, 62%)

HSB

hsb(11, 64%, 91%)

CMYK

cmyk(0%, 52%, 64%, 9%)

Oklch

oklch(67.7% 0.156 33.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BFE3E2

E3BFC0

Analogous

BFE3D0

BFE3E2

BFD2E3

Triadic

BFE3E2

E2BFE3

E3E2BF

Split-Comp.

BFE3E2

E3BFD2

E3D0BF

Tetradic

BFE3E2

D0BFE3

E3BFC0

D2E3BF

Contrast Matrix WCAG 2.1 Contrast

BFE3E2	A9C7C6	C89A8C	D78470	E76E53
—	1.3 Fail	1.8 Fail	2.1 Fail	2.3 Fail
1.3 Fail	—	1.4 Fail	1.6 Fail	1.7 Fail
1.8 Fail	1.4 Fail	—	1.1 Fail	1.3 Fail
2.1 Fail	1.6 Fail	1.1 Fail	—	1.1 Fail
2.3 Fail	1.7 Fail	1.3 Fail	1.1 Fail	—

White BG

1.4Fail

1.8Fail

2.5Fail

2.8Fail

3.1AA Large

Black BG

15.3AAA

11.7AAA

8.5AAA

7.4AAA

6.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CFCFE2

B6B6C6

B4B48F

B3B275

B3B25A

Deuteranopia

CDCAE2

B4B2C6

B7BA90

B8BE76

BAC35B

Tritanopia

C1E2E2

AAC6C6

C69293

D3797A

E15F60

Achromatopsia

D8D8D8

BEBEBE

A6A6A6

9B9B9B

8F8F8F

Shades & Tints Shades & Tints

#BFE3E2

Dark

Light

#A9C7C6

Dark

Light

#C89A8C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bfe3e2;
  --color-2: #a9c7c6;
  --color-3: #c89a8c;
  --color-4: #d78470;
  --color-5: #e76e53;
}

SCSS

$color-1: #bfe3e2;
$color-2: #a9c7c6;
$color-3: #c89a8c;
$color-4: #d78470;
$color-5: #e76e53;

TAILWIND

colors: {
  'brand-1': '#bfe3e2',
  'brand-2': '#a9c7c6',
  'brand-3': '#c89a8c',
  'brand-4': '#d78470',
  'brand-5': '#e76e53',
}

RGB Array

[191, 227, 226], [169, 199, 198], [200, 154, 140], [215, 132, 112], [231, 110, 83]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BFE3E2, #A9C7C6, #C89A8C, #D78470, #E76E53 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: #bfe3e2; --color-2: #a9c7c6; --color-3: #c89a8c; --color-4: #d78470; --color-5: #e76e53. 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 general-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