#E5D4F9 + #F3BFE1 + #DC90CF + #788EAD + #A7D8CD - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E5D4F9

Wisteria · Lavender · Lavender

HEX

#E5D4F9

RGB

rgb(229, 212, 249)

HSL

hsl(268, 76%, 90%)

HSB

hsb(268, 15%, 98%)

CMYK

cmyk(8%, 15%, 0%, 2%)

Oklch

oklch(89.5% 0.053 306.1)

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

#F3BFE1

Mauve · Pink · Cherry Blossom

HEX

#F3BFE1

RGB

rgb(243, 191, 225)

HSL

hsl(321, 68%, 85%)

HSB

hsb(321, 21%, 95%)

CMYK

cmyk(0%, 21%, 7%, 5%)

Oklch

oklch(86.1% 0.074 339.5)

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

#DC90CF

Mauve · Orchid · Lilac Purple

HEX

#DC90CF

RGB

rgb(220, 144, 207)

HSL

hsl(310, 52%, 71%)

HSB

hsb(310, 35%, 86%)

CMYK

cmyk(0%, 35%, 6%, 14%)

Oklch

oklch(75.0% 0.122 333.1)

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

#788EAD

Azure · LightSlateGray · Navy Blue

HEX

#788EAD

RGB

rgb(120, 142, 173)

HSL

hsl(215, 24%, 57%)

HSB

hsb(215, 31%, 68%)

CMYK

cmyk(31%, 18%, 0%, 32%)

Oklch

oklch(64.1% 0.053 257.0)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#A7D8CD

Jade · LightBlue · Lake Green

HEX

#A7D8CD

RGB

rgb(167, 216, 205)

HSL

hsl(167, 39%, 75%)

HSB

hsb(167, 23%, 85%)

CMYK

cmyk(23%, 0%, 5%, 15%)

Oklch

oklch(84.5% 0.053 179.7)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E5D4F9

E7F9D2

Analogous

D2D3F9

E5D4F9

F8D2F9

Triadic

E5D4F9

F9E4D2

D2F9E4

Split-Comp.

E5D4F9

F9F8D2

D3F9D2

Tetradic

E5D4F9

F9D2D3

E7F9D2

D2F9F8

Contrast Matrix WCAG 2.1 Contrast

E5D4F9	F3BFE1	DC90CF	788EAD	A7D8CD
—	1.1 Fail	1.7 Fail	2.4 Fail	1.1 Fail
1.1 Fail	—	1.5 Fail	2.1 Fail	1.0 Fail
1.7 Fail	1.5 Fail	—	1.4 Fail	1.5 Fail
2.4 Fail	2.1 Fail	1.4 Fail	—	2.1 Fail
1.1 Fail	1.0 Fail	1.5 Fail	2.1 Fail	—

White BG

1.4Fail

1.6Fail

2.4Fail

3.3AA Large

1.6Fail

Black BG

15.1AAA

13.4AAA

8.9AAA

6.3AA

13.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

DEDDF0

DCDCD9

BBBAC0

8282A5

BCBDD0

Deuteranopia

DFE0EE

E0E3D7

C0C5BC

807FA4

B9B6D0

Tritanopia

E4E9E7

F0D2D1

D8B4B1

79A09E

A9D2D2

Achromatopsia

DDDDDD

D2D2D2

AEAEAE

8B8B8B

C8C8C8

Shades & Tints Shades & Tints

#E5D4F9

Dark

Light

#F3BFE1

Dark

Light

#DC90CF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e5d4f9;
  --color-2: #f3bfe1;
  --color-3: #dc90cf;
  --color-4: #788ead;
  --color-5: #a7d8cd;
}

SCSS

$color-1: #e5d4f9;
$color-2: #f3bfe1;
$color-3: #dc90cf;
$color-4: #788ead;
$color-5: #a7d8cd;

TAILWIND

colors: {
  'brand-1': '#e5d4f9',
  'brand-2': '#f3bfe1',
  'brand-3': '#dc90cf',
  'brand-4': '#788ead',
  'brand-5': '#a7d8cd',
}

RGB Array

[229, 212, 249], [243, 191, 225], [220, 144, 207], [120, 142, 173], [167, 216, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E5D4F9, #F3BFE1, #DC90CF, #788EAD, #A7D8CD 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: #e5d4f9; --color-2: #f3bfe1; --color-3: #dc90cf; --color-4: #788ead; --color-5: #a7d8cd. 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