← Back to Editor

#A3817F · #77004A · #A10047 · #D03B31 · #D6CDCD

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

#A3817F

Crimson · Gray · Passion Red

HEX
#A3817F
RGB
rgb(163, 129, 127)
HSL
hsl(3, 16%, 57%)
HSB
hsb(3, 22%, 64%)
CMYK
cmyk(0%, 21%, 22%, 36%)
Oklch
oklch(63.5% 0.042 22.2)

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

#77004A

Rose Purple · Purple · Raspberry

HEX
#77004A
RGB
rgb(119, 0, 74)
HSL
hsl(323, 100%, 23%)
HSB
hsb(323, 100%, 47%)
CMYK
cmyk(0%, 100%, 38%, 53%)
Oklch
oklch(37.4% 0.155 351.5)

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

#A10047

Dark Violet · Brown · Camellia

HEX
#A10047
RGB
rgb(161, 0, 71)
HSL
hsl(334, 100%, 32%)
HSB
hsb(334, 100%, 63%)
CMYK
cmyk(0%, 100%, 56%, 37%)
Oklch
oklch(45.5% 0.183 6.0)

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

#D03B31

Vermilion · FireBrick · Passion Red

HEX
#D03B31
RGB
rgb(208, 59, 49)
HSL
hsl(4, 63%, 50%)
HSB
hsb(4, 76%, 82%)
CMYK
cmyk(0%, 72%, 76%, 18%)
Oklch
oklch(57.3% 0.188 28.3)

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

#D6CDCD

Peach Pink · LightGray · Cherry Blossom

HEX
#D6CDCD
RGB
rgb(214, 205, 205)
HSL
hsl(0, 10%, 82%)
HSB
hsb(0, 4%, 84%)
CMYK
cmyk(0%, 4%, 4%, 16%)
Oklch
oklch(85.6% 0.010 17.4)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3817F
80A1A3

Analogous

A38090
A3817F
A39380

Triadic

A3817F
80A382
8280A3

Split-Comp.

A3817F
80A393
8090A3

Tetradic

A3817F
90A380
80A1A3
9380A3

Contrast Matrix WCAG 2.1 Contrast

A3817F
77004A
A10047
D03B31
D6CDCD
—
3.2
AA Large
2.3
Fail
1.4
Fail
2.2
Fail
3.2
AA Large
—
1.4
Fail
2.3
Fail
7.2
AAA
2.3
Fail
1.4
Fail
—
1.7
Fail
5.2
AA
1.4
Fail
2.3
Fail
1.7
Fail
—
3.1
AA Large
2.2
Fail
7.2
AAA
5.2
AA
3.1
AA Large
—
White BG
3.5AA Large
11.2AAA
8.1AAA
4.8AA
1.6Fail
Black BG
6.0AA
1.9Fail
2.6Fail
4.4AA Large
13.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

94947F
434238
5B5A36
8F8E33
D2D2CD

Deuteranopia

969980
4A5334
657132
98A334
D3D3CD

Tritanopia

A18080
712A27
992825
C93536
D6CDCD

Achromatopsia

8B8B8B
2C2C2C
383838
666666
D0D0D0

Shades & Tints Shades & Tints

#A3817F

Dark
Light

#77004A

Dark
Light

#A10047

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3817f;
  --color-2: #77004a;
  --color-3: #a10047;
  --color-4: #d03b31;
  --color-5: #d6cdcd;
}

SCSS

$color-1: #a3817f;
$color-2: #77004a;
$color-3: #a10047;
$color-4: #d03b31;
$color-5: #d6cdcd;

TAILWIND

colors: {
  'brand-1': '#a3817f',
  'brand-2': '#77004a',
  'brand-3': '#a10047',
  'brand-4': '#d03b31',
  'brand-5': '#d6cdcd',
}

RGB Array

[163, 129, 127], [119, 0, 74], [161, 0, 71], [208, 59, 49], [214, 205, 205]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3817F, #77004A, #A10047, #D03B31, #D6CDCD 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: #a3817f; --color-2: #77004a; --color-3: #a10047; --color-4: #d03b31; --color-5: #d6cdcd. 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