← Back to Editor

#2C1F36 · #B163A3 · #B79FC2 · #E2CFFF · #F5F2ED

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#2C1F36

Dark Plum · DarkSlateGray · Dark Purple

HEX
#2C1F36
RGB
rgb(44, 31, 54)
HSL
hsl(274, 27%, 17%)
HSB
hsb(274, 43%, 21%)
CMYK
cmyk(19%, 43%, 0%, 79%)
Oklch
oklch(26.6% 0.045 309.5)

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

#B163A3

Rose Purple · MediumOrchid · Violet

HEX
#B163A3
RGB
rgb(177, 99, 163)
HSL
hsl(311, 33%, 54%)
HSB
hsb(311, 44%, 69%)
CMYK
cmyk(0%, 44%, 8%, 31%)
Oklch
oklch(61.0% 0.130 334.0)

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

#B79FC2

Lilac · DarkGray · Lilac Purple

HEX
#B79FC2
RGB
rgb(183, 159, 194)
HSL
hsl(281, 22%, 69%)
HSB
hsb(281, 18%, 76%)
CMYK
cmyk(6%, 18%, 0%, 24%)
Oklch
oklch(73.5% 0.056 315.2)

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

#E2CFFF

Wisteria · Lavender · Lavender

HEX
#E2CFFF
RGB
rgb(226, 207, 255)
HSL
hsl(264, 100%, 91%)
HSB
hsb(264, 19%, 100%)
CMYK
cmyk(11%, 19%, 0%, 0%)
Oklch
oklch(88.5% 0.068 303.1)

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

#F5F2ED

Goose Yellow · Linen · Peach Orange

HEX
#F5F2ED
RGB
rgb(245, 242, 237)
HSL
hsl(37, 29%, 95%)
HSB
hsb(37, 3%, 96%)
CMYK
cmyk(0%, 1%, 3%, 4%)
Oklch
oklch(96.2% 0.007 80.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2C1F36
2A3720

Analogous

212037
2C1F36
372035

Triadic

2C1F36
372D20
20372D

Split-Comp.

2C1F36
353720
203721

Tetradic

2C1F36
372120
2A3720
203537

Contrast Matrix WCAG 2.1 Contrast

2C1F36
B163A3
B79FC2
E2CFFF
F5F2ED
—
3.8
AA Large
6.5
AA
10.8
AAA
13.9
AAA
3.8
AA Large
—
1.7
Fail
2.8
Fail
3.6
AA Large
6.5
AA
1.7
Fail
—
1.7
Fail
2.1
Fail
10.8
AAA
2.8
Fail
1.7
Fail
—
1.3
Fail
13.9
AAA
3.6
AA Large
2.1
Fail
1.3
Fail
—
White BG
15.5AAA
4.1AA Large
2.4Fail
1.4Fail
1.1Fail
Black BG
1.4Fail
5.2AA
8.8AAA
14.6AAA
18.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

262630
8F8F94
ADACBA
DADAF3
F4F4EE

Deuteranopia

27282F
949A90
AEB0B7
DBDCF1
F4F4EE

Tritanopia

2B2C2B
AD8785
B6B3B1
E1EAE8
F5EFEF

Achromatopsia

262626
828282
AAAAAA
DADADA
F2F2F2

Shades & Tints Shades & Tints

#2C1F36

Dark
Light

#B163A3

Dark
Light

#B79FC2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2c1f36;
  --color-2: #b163a3;
  --color-3: #b79fc2;
  --color-4: #e2cfff;
  --color-5: #f5f2ed;
}

SCSS

$color-1: #2c1f36;
$color-2: #b163a3;
$color-3: #b79fc2;
$color-4: #e2cfff;
$color-5: #f5f2ed;

TAILWIND

colors: {
  'brand-1': '#2c1f36',
  'brand-2': '#b163a3',
  'brand-3': '#b79fc2',
  'brand-4': '#e2cfff',
  'brand-5': '#f5f2ed',
}

RGB Array

[44, 31, 54], [177, 99, 163], [183, 159, 194], [226, 207, 255], [245, 242, 237]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2C1F36, #B163A3, #B79FC2, #E2CFFF, #F5F2ED is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #2c1f36; --color-2: #b163a3; --color-3: #b79fc2; --color-4: #e2cfff; --color-5: #f5f2ed. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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