#FFE7F0 + #F6CDD5 + #EB849F + #D1A7B1 + #D1CDCE - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFE7F0

Rouge · SeaShell · Cherry Blossom

HEX

#FFE7F0

RGB

rgb(255, 231, 240)

HSL

hsl(338, 100%, 95%)

HSB

hsb(338, 9%, 100%)

CMYK

cmyk(0%, 9%, 6%, 0%)

Oklch

oklch(95.0% 0.029 352.9)

Traditional「Rouge」· Paint「Cherry Blossom」· Creative Rose Petal

#F6CDD5

Peach Pink · Pink · Cherry Blossom

HEX

#F6CDD5

RGB

rgb(246, 205, 213)

HSL

hsl(348, 69%, 88%)

HSB

hsb(348, 17%, 96%)

CMYK

cmyk(0%, 17%, 13%, 4%)

Oklch

oklch(88.6% 0.047 4.9)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Rose Petal

#EB849F

Rouge · LightCoral · Rose Pink

HEX

#EB849F

RGB

rgb(235, 132, 159)

HSL

hsl(344, 72%, 72%)

HSB

hsb(344, 44%, 92%)

CMYK

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

Oklch

oklch(73.2% 0.129 4.0)

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

#D1A7B1

Peach Pink · Silver · Coral Red

HEX

#D1A7B1

RGB

rgb(209, 167, 177)

HSL

hsl(346, 31%, 74%)

HSB

hsb(346, 20%, 82%)

CMYK

cmyk(0%, 20%, 15%, 18%)

Oklch

oklch(76.9% 0.051 2.4)

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

#D1CDCE

Silver Gray · LightGray · Pearl Gray

HEX

#D1CDCE

RGB

rgb(209, 205, 206)

HSL

hsl(345, 4%, 81%)

HSB

hsb(345, 2%, 82%)

CMYK

cmyk(0%, 2%, 1%, 18%)

Oklch

oklch(85.2% 0.005 0.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFE7F0

E5FFF6

Analogous

FFE5FC

FFE7F0

FFE9E5

Triadic

FFE7F0

EFFFE5

E5EFFF

Split-Comp.

FFE7F0

E5FFE9

E5FCFF

Tetradic

FFE7F0

FCFFE5

E5FFF6

E9E5FF

Contrast Matrix WCAG 2.1 Contrast

FFE7F0	F6CDD5	EB849F	D1A7B1	D1CDCE
—	1.2 Fail	2.2 Fail	1.8 Fail	1.3 Fail
1.2 Fail	—	1.8 Fail	1.5 Fail	1.1 Fail
2.2 Fail	1.8 Fail	—	1.2 Fail	1.6 Fail
1.8 Fail	1.5 Fail	1.2 Fail	—	1.4 Fail
1.3 Fail	1.1 Fail	1.6 Fail	1.4 Fail	—

White BG

1.2Fail

1.4Fail

2.5Fail

2.1Fail

1.6Fail

Black BG

17.9AAA

14.6AAA

8.3AAA

9.9AAA

13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F5F4EE

E4E4D3

BEBD98

BFBEAF

CFCFCE

Deuteranopia

F6F8ED

E7EAD3

C4CC97

C1C4AE

D0D0CE

Tritanopia

FEECEC

F4D2D1

E69392

CFADAC

D1CECE

Achromatopsia

EFEFEF

DADADA

A6A6A6

B5B5B5

CECECE

Shades & Tints Shades & Tints

#FFE7F0

Dark

Light

#F6CDD5

Dark

Light

#EB849F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffe7f0;
  --color-2: #f6cdd5;
  --color-3: #eb849f;
  --color-4: #d1a7b1;
  --color-5: #d1cdce;
}

SCSS

$color-1: #ffe7f0;
$color-2: #f6cdd5;
$color-3: #eb849f;
$color-4: #d1a7b1;
$color-5: #d1cdce;

TAILWIND

colors: {
  'brand-1': '#ffe7f0',
  'brand-2': '#f6cdd5',
  'brand-3': '#eb849f',
  'brand-4': '#d1a7b1',
  'brand-5': '#d1cdce',
}

RGB Array

[255, 231, 240], [246, 205, 213], [235, 132, 159], [209, 167, 177], [209, 205, 206]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFE7F0, #F6CDD5, #EB849F, #D1A7B1, #D1CDCE 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: #ffe7f0; --color-2: #f6cdd5; --color-3: #eb849f; --color-4: #d1a7b1; --color-5: #d1cdce. 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