#FA8770 + #E88686 + #D6869C + #C385B3 + #B184C9 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FA8770

Peach Pink · Salmon · Coral Red

HEX

#FA8770

RGB

rgb(250, 135, 112)

HSL

hsl(10, 93%, 71%)

HSB

hsb(10, 55%, 98%)

CMYK

cmyk(0%, 46%, 55%, 2%)

Oklch

oklch(74.5% 0.145 32.5)

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

#E88686

Peach Pink · LightCoral · Coral Red

HEX

#E88686

RGB

rgb(232, 134, 134)

HSL

hsl(0, 68%, 72%)

HSB

hsb(0, 42%, 91%)

CMYK

cmyk(0%, 42%, 42%, 9%)

Oklch

oklch(72.5% 0.120 20.4)

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

#D6869C

Rouge · LightCoral · Rose Pink

HEX

#D6869C

RGB

rgb(214, 134, 156)

HSL

hsl(344, 49%, 68%)

HSB

hsb(344, 37%, 84%)

CMYK

cmyk(0%, 37%, 27%, 16%)

Oklch

oklch(70.9% 0.101 2.2)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#C385B3

Mauve · DarkGray · Lilac Purple

HEX

#C385B3

RGB

rgb(195, 133, 179)

HSL

hsl(315, 34%, 64%)

HSB

hsb(315, 32%, 76%)

CMYK

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

Oklch

oklch(69.4% 0.097 336.4)

Traditional「Mauve」· Paint「Lilac Purple」· Creative Rose Petal

#B184C9

Lilac · Orchid · Lilac Purple

HEX

#B184C9

RGB

rgb(177, 132, 201)

HSL

hsl(279, 39%, 65%)

HSB

hsb(279, 34%, 79%)

CMYK

cmyk(12%, 34%, 0%, 21%)

Oklch

oklch(68.2% 0.110 313.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FA8770

70E3FA

Analogous

FA709E

FA8770

FACC70

Triadic

FA8770

70FA87

8770FA

Split-Comp.

FA8770

70FACC

709EFA

Tetradic

FA8770

9EFA70

70E3FA

CC70FA

Contrast Matrix WCAG 2.1 Contrast

FA8770	E88686	D6869C	C385B3	B184C9
—	1.1 Fail	1.1 Fail	1.2 Fail	1.2 Fail
1.1 Fail	—	1.1 Fail	1.1 Fail	1.2 Fail
1.1 Fail	1.1 Fail	—	1.1 Fail	1.1 Fail
1.2 Fail	1.1 Fail	1.1 Fail	—	1.0 Fail
1.2 Fail	1.2 Fail	1.1 Fail	1.0 Fail	—

White BG

2.4Fail

2.6Fail

2.7Fail

2.9Fail

3.0Fail

Black BG

8.8AAA

8.2AAA

7.7AAA

7.3AAA

7.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C8C776

BEBD86

B3B397

A8A8A8

9E9DB8

Deuteranopia

CFD877

C3CB86

B8BE95

ACB0A5

A0A4B4

Tritanopia

F47A7B

E38686

D29292

C09F9D

AFABA8

Achromatopsia

A7A7A7

A3A3A3

A0A0A0

9D9D9D

999999

Shades & Tints Shades & Tints

#FA8770

Dark

Light

#E88686

Dark

Light

#D6869C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fa8770;
  --color-2: #e88686;
  --color-3: #d6869c;
  --color-4: #c385b3;
  --color-5: #b184c9;
}

SCSS

$color-1: #fa8770;
$color-2: #e88686;
$color-3: #d6869c;
$color-4: #c385b3;
$color-5: #b184c9;

TAILWIND

colors: {
  'brand-1': '#fa8770',
  'brand-2': '#e88686',
  'brand-3': '#d6869c',
  'brand-4': '#c385b3',
  'brand-5': '#b184c9',
}

RGB Array

[250, 135, 112], [232, 134, 134], [214, 134, 156], [195, 133, 179], [177, 132, 201]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FA8770, #E88686, #D6869C, #C385B3, #B184C9 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: #fa8770; --color-2: #e88686; --color-3: #d6869c; --color-4: #c385b3; --color-5: #b184c9. 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