#C9557D + #E1878F + #F1AC9C + #F2CAAD + #C2C8AA - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#C9557D

Dark Violet · LightCoral · Rose Pink

HEX

#C9557D

RGB

rgb(201, 85, 125)

HSL

hsl(339, 52%, 56%)

HSB

hsb(339, 58%, 79%)

CMYK

cmyk(0%, 58%, 38%, 21%)

Oklch

oklch(60.8% 0.152 1.1)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#E1878F

Peach Pink · LightCoral · Coral Red

HEX

#E1878F

RGB

rgb(225, 135, 143)

HSL

hsl(355, 60%, 71%)

HSB

hsb(355, 40%, 88%)

CMYK

cmyk(0%, 40%, 36%, 12%)

Oklch

oklch(72.0% 0.111 14.5)

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

#F1AC9C

Peach Pink · BurlyWood · Coral Red

HEX

#F1AC9C

RGB

rgb(241, 172, 156)

HSL

hsl(11, 75%, 78%)

HSB

hsb(11, 35%, 95%)

CMYK

cmyk(0%, 29%, 35%, 5%)

Oklch

oklch(80.6% 0.085 33.5)

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

#F2CAAD

Apricot · Wheat · Peach Orange

HEX

#F2CAAD

RGB

rgb(242, 202, 173)

HSL

hsl(25, 73%, 81%)

HSB

hsb(25, 29%, 95%)

CMYK

cmyk(0%, 17%, 29%, 5%)

Oklch

oklch(86.6% 0.060 57.8)

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

#C2C8AA

Willow Green · Silver · Apple Green

HEX

#C2C8AA

RGB

rgb(194, 200, 170)

HSL

hsl(72, 21%, 73%)

HSB

hsb(72, 15%, 78%)

CMYK

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

Oklch

oklch(82.0% 0.041 116.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C9557D

54C9A0

Analogous

C954B8

C9557D

C96654

Triadic

C9557D

7DC954

547DC9

Split-Comp.

C9557D

54C966

54B8C9

Tetradic

C9557D

B8C954

54C9A0

6654C9

Contrast Matrix WCAG 2.1 Contrast

C9557D	E1878F	F1AC9C	F2CAAD	C2C8AA
—	1.6 Fail	2.2 Fail	2.7 Fail	2.4 Fail
1.6 Fail	—	1.4 Fail	1.7 Fail	1.5 Fail
2.2 Fail	1.4 Fail	—	1.2 Fail	1.1 Fail
2.7 Fail	1.7 Fail	1.2 Fail	—	1.1 Fail
2.4 Fail	1.5 Fail	1.1 Fail	1.1 Fail	—

White BG

4.1AA Large

2.6Fail

1.9Fail

1.5Fail

1.7Fail

Black BG

5.1AA

8.1AAA

11.1AAA

13.8AAA

12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

979673

BAB98D

D3D3A0

E1E0B4

C5C5B1

Deuteranopia

9EA671

BFC68D

D7DCA1

E3E6B6

C4C4B3

Tritanopia

C36C6A

DD8C8B

EEA3A4

F0BABB

C2B7B8

Achromatopsia

7C7C7C

A3A3A3

BFBFBF

D3D3D3

C3C3C3

Shades & Tints Shades & Tints

#C9557D

Dark

Light

#E1878F

Dark

Light

#F1AC9C

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c9557d;
  --color-2: #e1878f;
  --color-3: #f1ac9c;
  --color-4: #f2caad;
  --color-5: #c2c8aa;
}

SCSS

$color-1: #c9557d;
$color-2: #e1878f;
$color-3: #f1ac9c;
$color-4: #f2caad;
$color-5: #c2c8aa;

TAILWIND

colors: {
  'brand-1': '#c9557d',
  'brand-2': '#e1878f',
  'brand-3': '#f1ac9c',
  'brand-4': '#f2caad',
  'brand-5': '#c2c8aa',
}

RGB Array

[201, 85, 125], [225, 135, 143], [241, 172, 156], [242, 202, 173], [194, 200, 170]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C9557D, #E1878F, #F1AC9C, #F2CAAD, #C2C8AA 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: #c9557d; --color-2: #e1878f; --color-3: #f1ac9c; --color-4: #f2caad; --color-5: #c2c8aa. 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