#FF8394 + #D8E1C2 + #C1CAB9 + #CDA196 + #EF9998 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FF8394

Peach Pink · LightCoral · Coral Red

HEX

#FF8394

RGB

rgb(255, 131, 148)

HSL

hsl(352, 100%, 76%)

HSB

hsb(352, 49%, 100%)

CMYK

cmyk(0%, 49%, 42%, 0%)

Oklch

oklch(75.3% 0.151 12.8)

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

#D8E1C2

Willow Green · LightGray · Mint Green

HEX

#D8E1C2

RGB

rgb(216, 225, 194)

HSL

hsl(77, 34%, 82%)

HSB

hsb(77, 14%, 88%)

CMYK

cmyk(4%, 0%, 14%, 12%)

Oklch

oklch(89.5% 0.042 120.4)

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

#C1CAB9

Celadon · Silver · Apple Green

HEX

#C1CAB9

RGB

rgb(193, 202, 185)

HSL

hsl(92, 14%, 76%)

HSB

hsb(92, 8%, 79%)

CMYK

cmyk(4%, 0%, 8%, 21%)

Oklch

oklch(82.7% 0.025 129.9)

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

#CDA196

Peach Pink · Tan · Coral Red

HEX

#CDA196

RGB

rgb(205, 161, 150)

HSL

hsl(12, 35%, 70%)

HSB

hsb(12, 27%, 80%)

CMYK

cmyk(0%, 21%, 27%, 20%)

Oklch

oklch(74.6% 0.055 34.4)

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

#EF9998

Peach Pink · DarkSalmon · Coral Red

HEX

#EF9998

RGB

rgb(239, 153, 152)

HSL

hsl(1, 73%, 77%)

HSB

hsb(1, 36%, 94%)

CMYK

cmyk(0%, 36%, 36%, 6%)

Oklch

oklch(76.9% 0.104 20.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FF8394

85FFEF

Analogous

FF85D2

FF8394

FFB185

Triadic

FF8394

95FF85

8595FF

Split-Comp.

FF8394

85FFB1

85D2FF

Tetradic

FF8394

D2FF85

85FFEF

B185FF

Contrast Matrix WCAG 2.1 Contrast

FF8394	D8E1C2	C1CAB9	CDA196	EF9998
—	1.7 Fail	1.4 Fail	1.0 Fail	1.1 Fail
1.7 Fail	—	1.2 Fail	1.7 Fail	1.6 Fail
1.4 Fail	1.2 Fail	—	1.4 Fail	1.3 Fail
1.0 Fail	1.7 Fail	1.4 Fail	—	1.1 Fail
1.1 Fail	1.6 Fail	1.3 Fail	1.1 Fail	—

White BG

2.4Fail

1.4Fail

1.7Fail

2.3Fail

2.2Fail

Black BG

8.9AAA

15.5AAA

12.4AAA

9.1AAA

9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C9C890

DCDCCA

C5C5BD

BABA99

CAC998

Deuteranopia

D1DA8F

DBDBCB

C4C4BE

BDC099

CFD598

Tritanopia

F98D8C

D8CFD1

C1C0C1

CB9B9B

EB9898

Achromatopsia

AAAAAA

DBDBDB

C5C5C5

ADADAD

B3B3B3

Shades & Tints Shades & Tints

#FF8394

Dark

Light

#D8E1C2

Dark

Light

#C1CAB9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ff8394;
  --color-2: #d8e1c2;
  --color-3: #c1cab9;
  --color-4: #cda196;
  --color-5: #ef9998;
}

SCSS

$color-1: #ff8394;
$color-2: #d8e1c2;
$color-3: #c1cab9;
$color-4: #cda196;
$color-5: #ef9998;

TAILWIND

colors: {
  'brand-1': '#ff8394',
  'brand-2': '#d8e1c2',
  'brand-3': '#c1cab9',
  'brand-4': '#cda196',
  'brand-5': '#ef9998',
}

RGB Array

[255, 131, 148], [216, 225, 194], [193, 202, 185], [205, 161, 150], [239, 153, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FF8394, #D8E1C2, #C1CAB9, #CDA196, #EF9998 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: #ff8394; --color-2: #d8e1c2; --color-3: #c1cab9; --color-4: #cda196; --color-5: #ef9998. 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