← Back to Editor

#320B40 · #4C2A4B · #796464 · #BCA398 · #FFE1CC

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 LibraryData Visualization

Color Details Color Details

#320B40

Royal Purple · MidnightBlue · Dark Purple

HEX
#320B40
RGB
rgb(50, 11, 64)
HSL
hsl(284, 71%, 15%)
HSB
hsb(284, 83%, 25%)
CMYK
cmyk(22%, 83%, 0%, 75%)
Oklch
oklch(24.7% 0.099 315.4)

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

#4C2A4B

Rose Purple · DarkSlateGray · Eggplant

HEX
#4C2A4B
RGB
rgb(76, 42, 75)
HSL
hsl(302, 29%, 23%)
HSB
hsb(302, 45%, 30%)
CMYK
cmyk(0%, 45%, 1%, 70%)
Oklch
oklch(34.2% 0.071 328.0)

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

#796464

Crimson · DimGray · Passion Red

HEX
#796464
RGB
rgb(121, 100, 100)
HSL
hsl(0, 10%, 43%)
HSB
hsb(0, 17%, 47%)
CMYK
cmyk(0%, 17%, 17%, 53%)
Oklch
oklch(52.4% 0.027 18.1)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#BCA398

Apricot · DarkGray · Warm Sun

HEX
#BCA398
RGB
rgb(188, 163, 152)
HSL
hsl(18, 21%, 67%)
HSB
hsb(18, 19%, 74%)
CMYK
cmyk(0%, 13%, 19%, 26%)
Oklch
oklch(73.4% 0.033 45.2)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#FFE1CC

Apricot · Bisque · Peach Orange

HEX
#FFE1CC
RGB
rgb(255, 225, 204)
HSL
hsl(25, 100%, 90%)
HSB
hsb(25, 20%, 100%)
CMYK
cmyk(0%, 12%, 20%, 0%)
Oklch
oklch(92.9% 0.043 57.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

320B40
1A410B

Analogous

180B41
320B40
410B35

Triadic

320B40
41330B
0B4133

Split-Comp.

320B40
35410B
0B4118

Tetradic

320B40
41180B
1A410B
0B3541

Contrast Matrix WCAG 2.1 Contrast

320B40
4C2A4B
796464
BCA398
FFE1CC
—
1.4
Fail
3.0
AA Large
7.0
AAA
13.4
AAA
1.4
Fail
—
2.2
Fail
5.1
AA
9.7
AAA
3.0
AA Large
2.2
Fail
—
2.3
Fail
4.4
AA Large
7.0
AAA
5.1
AA
2.3
Fail
—
1.9
Fail
13.4
AAA
9.7
AAA
4.4
AA Large
1.9
Fail
—
White BG
16.7AAA
12.1AAA
5.5AA
2.4Fail
1.2Fail
Black BG
1.3Fail
1.7Fail
3.8AA Large
8.8AAA
16.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

212133
3D3D43
707064
B1B19B
F2F2D1

Deuteranopia

232630
3F4241
717364
B3B59B
F4F6D2

Tritanopia

302927
4A3D3B
786464
BB9D9D
FED5D6

Achromatopsia

1D1D1D
383838
6A6A6A
A9A9A9
E8E8E8

Shades & Tints Shades & Tints

#320B40

Dark
Light

#4C2A4B

Dark
Light

#796464

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #320b40;
  --color-2: #4c2a4b;
  --color-3: #796464;
  --color-4: #bca398;
  --color-5: #ffe1cc;
}

SCSS

$color-1: #320b40;
$color-2: #4c2a4b;
$color-3: #796464;
$color-4: #bca398;
$color-5: #ffe1cc;

TAILWIND

colors: {
  'brand-1': '#320b40',
  'brand-2': '#4c2a4b',
  'brand-3': '#796464',
  'brand-4': '#bca398',
  'brand-5': '#ffe1cc',
}

RGB Array

[50, 11, 64], [76, 42, 75], [121, 100, 100], [188, 163, 152], [255, 225, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #320B40, #4C2A4B, #796464, #BCA398, #FFE1CC is ideal for: 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: #320b40; --color-2: #4c2a4b; --color-3: #796464; --color-4: #bca398; --color-5: #ffe1cc. 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. 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