#FD5A67 + #EB7A87 + #D49F9F + #BFC0BA + #ADE5D3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FD5A67

Peach Pink · Tomato · Coral Red

HEX

#FD5A67

RGB

rgb(253, 90, 103)

HSL

hsl(355, 98%, 67%)

HSB

hsb(355, 64%, 99%)

CMYK

cmyk(0%, 64%, 59%, 1%)

Oklch

oklch(68.8% 0.198 19.5)

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

#EB7A87

Peach Pink · LightCoral · Coral Red

HEX

#EB7A87

RGB

rgb(235, 122, 135)

HSL

hsl(353, 74%, 70%)

HSB

hsb(353, 48%, 92%)

CMYK

cmyk(0%, 48%, 43%, 8%)

Oklch

oklch(71.1% 0.139 14.0)

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

#D49F9F

Peach Pink · Tan · Coral Red

HEX

#D49F9F

RGB

rgb(212, 159, 159)

HSL

hsl(0, 38%, 73%)

HSB

hsb(0, 25%, 83%)

CMYK

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

Oklch

oklch(75.2% 0.063 18.7)

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

#BFC0BA

Silver Gray · Silver · Pearl Gray

HEX

#BFC0BA

RGB

rgb(191, 192, 186)

HSL

hsl(70, 5%, 74%)

HSB

hsb(70, 3%, 75%)

CMYK

cmyk(1%, 0%, 3%, 25%)

Oklch

oklch(80.5% 0.008 114.3)

Traditional「Silver Gray」· Paint「Pearl Gray」· Creative Silver Lining

#ADE5D3

Jade · LightBlue · Glacier Blue

HEX

#ADE5D3

RGB

rgb(173, 229, 211)

HSL

hsl(161, 52%, 79%)

HSB

hsb(161, 24%, 90%)

CMYK

cmyk(24%, 0%, 8%, 10%)

Oklch

oklch(87.8% 0.062 173.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FD5A67

58FDF0

Analogous

FD58B9

FD5A67

FD9D58

Triadic

FD5A67

66FD58

5866FD

Split-Comp.

FD5A67

58FD9D

58B9FD

Tetradic

FD5A67

B9FD58

58FDF0

9D58FD

Contrast Matrix WCAG 2.1 Contrast

FD5A67	EB7A87	D49F9F	BFC0BA	ADE5D3
—	1.1 Fail	1.4 Fail	1.7 Fail	2.2 Fail
1.1 Fail	—	1.2 Fail	1.5 Fail	1.9 Fail
1.4 Fail	1.2 Fail	—	1.2 Fail	1.6 Fail
1.7 Fail	1.5 Fail	1.2 Fail	—	1.3 Fail
2.2 Fail	1.9 Fail	1.6 Fail	1.3 Fail	—

White BG

3.1AA Large

2.7Fail

2.3Fail

1.8Fail

1.4Fail

Black BG

6.8AA

7.7AAA

9.3AAA

11.5AAA

14.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B564

BAB984

BDBD9F

BFBFBB

C5C6D7

Deuteranopia

C0CC63

C1C983

C0C49F

BFBFBC

C2BED8

Tritanopia

F56161

E58181

D19F9F

BFBDBD

B0DBDC

Achromatopsia

8C8C8C

9D9D9D

AFAFAF

BFBFBF

D2D2D2

Shades & Tints Shades & Tints

#FD5A67

Dark

Light

#EB7A87

Dark

Light

#D49F9F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fd5a67;
  --color-2: #eb7a87;
  --color-3: #d49f9f;
  --color-4: #bfc0ba;
  --color-5: #ade5d3;
}

SCSS

$color-1: #fd5a67;
$color-2: #eb7a87;
$color-3: #d49f9f;
$color-4: #bfc0ba;
$color-5: #ade5d3;

TAILWIND

colors: {
  'brand-1': '#fd5a67',
  'brand-2': '#eb7a87',
  'brand-3': '#d49f9f',
  'brand-4': '#bfc0ba',
  'brand-5': '#ade5d3',
}

RGB Array

[253, 90, 103], [235, 122, 135], [212, 159, 159], [191, 192, 186], [173, 229, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FD5A67, #EB7A87, #D49F9F, #BFC0BA, #ADE5D3 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: #fd5a67; --color-2: #eb7a87; --color-3: #d49f9f; --color-4: #bfc0ba; --color-5: #ade5d3. 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