#E80CFA + #B671BD + #A1A3C9 + #9FC0CF + #C1E3DC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#E80CFA

Royal Purple · Magenta · Violet

HEX

#E80CFA

RGB

rgb(232, 12, 250)

HSL

hsl(295, 96%, 51%)

HSB

hsb(295, 95%, 98%)

CMYK

cmyk(7%, 95%, 0%, 2%)

Oklch

oklch(66.6% 0.309 324.3)

Traditional「Royal Purple」· Paint「Violet」· Creative Blush Sunrise

#B671BD

Dark Plum · MediumOrchid · Violet

HEX

#B671BD

RGB

rgb(182, 113, 189)

HSL

hsl(294, 37%, 59%)

HSB

hsb(294, 40%, 74%)

CMYK

cmyk(4%, 40%, 0%, 26%)

Oklch

oklch(65.0% 0.133 323.6)

Traditional「Dark Plum」· Paint「Violet」· Creative Blush Sunrise

#A1A3C9

Azure · DarkGray · Cobalt Blue

HEX

#A1A3C9

RGB

rgb(161, 163, 201)

HSL

hsl(237, 27%, 71%)

HSB

hsb(237, 20%, 79%)

CMYK

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

Oklch

oklch(72.7% 0.055 282.6)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#9FC0CF

Sky Blue · LightSteelBlue · Lake Green

HEX

#9FC0CF

RGB

rgb(159, 192, 207)

HSL

hsl(199, 33%, 72%)

HSB

hsb(199, 23%, 81%)

CMYK

cmyk(23%, 7%, 0%, 19%)

Oklch

oklch(78.8% 0.041 227.2)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#C1E3DC

Jade · LightBlue · Glacier Blue

HEX

#C1E3DC

RGB

rgb(193, 227, 220)

HSL

hsl(168, 38%, 82%)

HSB

hsb(168, 15%, 89%)

CMYK

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

Oklch

oklch(88.9% 0.037 181.6)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

E80CFA

1EFA0A

Analogous

6E0AFA

E80CFA

FA0A96

Triadic

E80CFA

FAE60A

0AFAE6

Split-Comp.

E80CFA

96FA0A

0AFA6E

Tetradic

E80CFA

FA6E0A

1EFA0A

0A96FA

Contrast Matrix WCAG 2.1 Contrast

E80CFA	B671BD	A1A3C9	9FC0CF	C1E3DC
—	1.0 Fail	1.5 Fail	1.9 Fail	2.6 Fail
1.0 Fail	—	1.4 Fail	1.8 Fail	2.5 Fail
1.5 Fail	1.4 Fail	—	1.3 Fail	1.8 Fail
1.9 Fail	1.8 Fail	1.3 Fail	—	1.4 Fail
2.6 Fail	2.5 Fail	1.8 Fail	1.4 Fail	—

White BG

3.6AA Large

3.5AA Large

2.4Fail

1.9Fail

1.4Fail

Black BG

5.9AA

6.1AA

8.6AAA

10.9AAA

15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8987C0

9898AB

A2A2C0

ADAECB

D0D0DE

Deuteranopia

96A6B3

9CA1A6

A2A2BE

ABA9CA

CECBDE

Tritanopia

DD9389

B39C99

A1B9B7

A1C9C8

C3DFDF

Achromatopsia

696969

8E8E8E

A7A7A7

B8B8B8

D8D8D8

Shades & Tints Shades & Tints

#E80CFA

Dark

Light

#B671BD

Dark

Light

#A1A3C9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #e80cfa;
  --color-2: #b671bd;
  --color-3: #a1a3c9;
  --color-4: #9fc0cf;
  --color-5: #c1e3dc;
}

SCSS

$color-1: #e80cfa;
$color-2: #b671bd;
$color-3: #a1a3c9;
$color-4: #9fc0cf;
$color-5: #c1e3dc;

TAILWIND

colors: {
  'brand-1': '#e80cfa',
  'brand-2': '#b671bd',
  'brand-3': '#a1a3c9',
  'brand-4': '#9fc0cf',
  'brand-5': '#c1e3dc',
}

RGB Array

[232, 12, 250], [182, 113, 189], [161, 163, 201], [159, 192, 207], [193, 227, 220]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #E80CFA, #B671BD, #A1A3C9, #9FC0CF, #C1E3DC 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: #e80cfa; --color-2: #b671bd; --color-3: #a1a3c9; --color-4: #9fc0cf; --color-5: #c1e3dc. 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