#FFE3CC + #F7D0D1 + #E8BED6 + #C7B3D6 + #A69EB0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#FFE3CC

Apricot · Bisque · Peach Orange

HEX

#FFE3CC

RGB

rgb(255, 227, 204)

HSL

hsl(27, 100%, 90%)

HSB

hsb(27, 20%, 100%)

CMYK

cmyk(0%, 11%, 20%, 0%)

Oklch

oklch(93.3% 0.043 61.7)

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

#F7D0D1

Peach Pink · Pink · Cherry Blossom

HEX

#F7D0D1

RGB

rgb(247, 208, 209)

HSL

hsl(358, 71%, 89%)

HSB

hsb(358, 16%, 97%)

CMYK

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

Oklch

oklch(89.1% 0.044 16.3)

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

#E8BED6

Mauve · Pink · Cherry Blossom

HEX

#E8BED6

RGB

rgb(232, 190, 214)

HSL

hsl(326, 48%, 83%)

HSB

hsb(326, 18%, 91%)

CMYK

cmyk(0%, 18%, 8%, 9%)

Oklch

oklch(84.5% 0.057 343.1)

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

#C7B3D6

Lilac · Silver · Lilac Purple

HEX

#C7B3D6

RGB

rgb(199, 179, 214)

HSL

hsl(274, 30%, 77%)

HSB

hsb(274, 16%, 84%)

CMYK

cmyk(7%, 16%, 0%, 16%)

Oklch

oklch(79.5% 0.053 310.7)

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

#A69EB0

Wisteria · DarkGray · Lilac Purple

HEX

#A69EB0

RGB

rgb(166, 158, 176)

HSL

hsl(267, 10%, 65%)

HSB

hsb(267, 10%, 69%)

CMYK

cmyk(6%, 10%, 0%, 31%)

Oklch

oklch(71.2% 0.027 305.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFE3CC

CCE8FF

Analogous

FFCCCF

FFE3CC

FFFCCC

Triadic

FFE3CC

CCFFE3

E3CCFF

Split-Comp.

FFE3CC

CCFFFC

CCCFFF

Tetradic

FFE3CC

CFFFCC

CCE8FF

FCCCFF

Contrast Matrix WCAG 2.1 Contrast

FFE3CC	F7D0D1	E8BED6	C7B3D6	A69EB0
—	1.1 Fail	1.3 Fail	1.6 Fail	2.1 Fail
1.1 Fail	—	1.2 Fail	1.4 Fail	1.8 Fail
1.3 Fail	1.2 Fail	—	1.2 Fail	1.6 Fail
1.6 Fail	1.4 Fail	1.2 Fail	—	1.3 Fail
2.1 Fail	1.8 Fail	1.6 Fail	1.3 Fail	—

White BG

1.2Fail

1.4Fail

1.6Fail

1.9Fail

2.6Fail

Black BG

17.1AAA

14.9AAA

12.8AAA

10.8AAA

8.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F3F3D2

E6E6D1

D6D5D0

BEBECE

A3A2AC

Deuteranopia

F5F7D3

E8EBD1

D8DBCF

C0C1CB

A3A4AB

Tritanopia

FED6D7

F5D1D1

E6CCCB

C6C7C5

A6A8A7

Achromatopsia

E9E9E9

DCDCDC

CDCDCD

BDBDBD

A2A2A2

Shades & Tints Shades & Tints

#FFE3CC

Dark

Light

#F7D0D1

Dark

Light

#E8BED6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ffe3cc;
  --color-2: #f7d0d1;
  --color-3: #e8bed6;
  --color-4: #c7b3d6;
  --color-5: #a69eb0;
}

SCSS

$color-1: #ffe3cc;
$color-2: #f7d0d1;
$color-3: #e8bed6;
$color-4: #c7b3d6;
$color-5: #a69eb0;

TAILWIND

colors: {
  'brand-1': '#ffe3cc',
  'brand-2': '#f7d0d1',
  'brand-3': '#e8bed6',
  'brand-4': '#c7b3d6',
  'brand-5': '#a69eb0',
}

RGB Array

[255, 227, 204], [247, 208, 209], [232, 190, 214], [199, 179, 214], [166, 158, 176]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FFE3CC, #F7D0D1, #E8BED6, #C7B3D6, #A69EB0 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: #ffe3cc; --color-2: #f7d0d1; --color-3: #e8bed6; --color-4: #c7b3d6; --color-5: #a69eb0. 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