← Back to Editor

#C291F2 · #A581C9 · #C981C7 · #81C98D · #8058A8

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C291F2

Lilac · Violet · Lilac Purple

HEX
#C291F2
RGB
rgb(194, 145, 242)
HSL
hsl(270, 79%, 76%)
HSB
hsb(270, 40%, 95%)
CMYK
cmyk(20%, 40%, 0%, 5%)
Oklch
oklch(74.0% 0.144 306.4)

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

#A581C9

Lilac · MediumOrchid · Lilac Purple

HEX
#A581C9
RGB
rgb(165, 129, 201)
HSL
hsl(270, 40%, 65%)
HSB
hsb(270, 36%, 79%)
CMYK
cmyk(18%, 36%, 0%, 21%)
Oklch
oklch(66.5% 0.111 306.6)

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

#C981C7

Mauve · Orchid · Lilac Purple

HEX
#C981C7
RGB
rgb(201, 129, 199)
HSL
hsl(302, 40%, 65%)
HSB
hsb(302, 36%, 79%)
CMYK
cmyk(0%, 36%, 1%, 21%)
Oklch
oklch(70.1% 0.127 327.8)

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

#81C98D

Celadon · DarkSeaGreen · Apple Green

HEX
#81C98D
RGB
rgb(129, 201, 141)
HSL
hsl(130, 40%, 65%)
HSB
hsb(130, 36%, 79%)
CMYK
cmyk(36%, 0%, 30%, 21%)
Oklch
oklch(77.3% 0.112 148.6)

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

#8058A8

Dark Plum · SlateBlue · Violet

HEX
#8058A8
RGB
rgb(128, 88, 168)
HSL
hsl(270, 31%, 50%)
HSB
hsb(270, 48%, 66%)
CMYK
cmyk(24%, 48%, 0%, 34%)
Oklch
oklch(53.7% 0.127 305.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C291F2
C2F291

Analogous

9191F2
C291F2
F291F2

Triadic

C291F2
F2C291
91F2C2

Split-Comp.

C291F2
F2F291
91F291

Tetradic

C291F2
F29191
C2F291
91F2F2

Contrast Matrix WCAG 2.1 Contrast

C291F2
A581C9
C981C7
81C98D
8058A8
—
1.3
Fail
1.2
Fail
1.2
Fail
2.2
Fail
1.3
Fail
—
1.1
Fail
1.6
Fail
1.7
Fail
1.2
Fail
1.1
Fail
—
1.4
Fail
1.9
Fail
1.2
Fail
1.6
Fail
1.4
Fail
—
2.8
Fail
2.2
Fail
1.7
Fail
1.9
Fail
2.8
Fail
—
White BG
2.4Fail
3.2AA Large
2.8Fail
2.0Fail
5.4AA
Black BG
8.6AAA
6.6AA
7.4AAA
10.7AAA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

ADACDB
9595B8
AAA9B6
A0A19C
6F6E95

Deuteranopia

B0B3D5
989AB3
AEB3B2
9C979F
717490

Tritanopia

C0C8C4
A3AAA7
C5A9A6
85A7AA
7E8582

Achromatopsia

ABABAB
949494
9F9F9F
ADADAD
6D6D6D

Shades & Tints Shades & Tints

#C291F2

Dark
Light

#A581C9

Dark
Light

#C981C7

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c291f2;
  --color-2: #a581c9;
  --color-3: #c981c7;
  --color-4: #81c98d;
  --color-5: #8058a8;
}

SCSS

$color-1: #c291f2;
$color-2: #a581c9;
$color-3: #c981c7;
$color-4: #81c98d;
$color-5: #8058a8;

TAILWIND

colors: {
  'brand-1': '#c291f2',
  'brand-2': '#a581c9',
  'brand-3': '#c981c7',
  'brand-4': '#81c98d',
  'brand-5': '#8058a8',
}

RGB Array

[194, 145, 242], [165, 129, 201], [201, 129, 199], [129, 201, 141], [128, 88, 168]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C291F2, #A581C9, #C981C7, #81C98D, #8058A8 is ideal for: corporate websites, product showcases, portfolios. 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: #c291f2; --color-2: #a581c9; --color-3: #c981c7; --color-4: #81c98d; --color-5: #8058a8. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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