← Back to Editor

#A3354D · #D19178 · #786F61 · #E1F4D1 · #BECBA2

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

#A3354D

Crimson · Brown · Passion Red

HEX
#A3354D
RGB
rgb(163, 53, 77)
HSL
hsl(347, 51%, 42%)
HSB
hsb(347, 67%, 64%)
CMYK
cmyk(0%, 67%, 53%, 36%)
Oklch
oklch(49.6% 0.145 11.2)

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

#D19178

Apricot · DarkSalmon · Warm Sun

HEX
#D19178
RGB
rgb(209, 145, 120)
HSL
hsl(17, 49%, 65%)
HSB
hsb(17, 43%, 82%)
CMYK
cmyk(0%, 31%, 43%, 18%)
Oklch
oklch(71.4% 0.086 42.2)

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

#786F61

Ochre · DimGray · Amber Brown

HEX
#786F61
RGB
rgb(120, 111, 97)
HSL
hsl(37, 11%, 43%)
HSB
hsb(37, 19%, 47%)
CMYK
cmyk(0%, 7%, 19%, 53%)
Oklch
oklch(54.6% 0.024 79.0)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#E1F4D1

Emerald · Beige · Mint Green

HEX
#E1F4D1
RGB
rgb(225, 244, 209)
HSL
hsl(93, 61%, 89%)
HSB
hsb(93, 14%, 96%)
CMYK
cmyk(8%, 0%, 14%, 4%)
Oklch
oklch(94.4% 0.050 130.7)

Traditional「Emerald」· Paint「Mint Green」· Creative Mint Breeze

#BECBA2

Willow Green · Silver · Apple Green

HEX
#BECBA2
RGB
rgb(190, 203, 162)
HSL
hsl(79, 28%, 72%)
HSB
hsb(79, 20%, 80%)
CMYK
cmyk(6%, 0%, 20%, 20%)
Oklch
oklch(82.1% 0.057 122.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3354D
34A28A

Analogous

A23483
A3354D
A25334

Triadic

A3354D
4CA234
344CA2

Split-Comp.

A3354D
34A253
3483A2

Tetradic

A3354D
83A234
34A28A
5334A2

Contrast Matrix WCAG 2.1 Contrast

A3354D
D19178
786F61
E1F4D1
BECBA2
—
2.5
Fail
1.3
Fail
5.7
AA
3.9
AA Large
2.5
Fail
—
1.9
Fail
2.2
Fail
1.5
Fail
1.3
Fail
1.9
Fail
—
4.3
AA Large
2.9
Fail
5.7
AA
2.2
Fail
4.3
AA Large
—
1.5
Fail
3.9
AA Large
1.5
Fail
2.9
Fail
1.5
Fail
—
White BG
6.6AA
2.6Fail
4.9AA
1.2Fail
1.7Fail
Black BG
3.2AA Large
8.0AAA
4.2AA Large
18.1AAA
12.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

737247
B5B57E
747464
E9E9D9
C4C4AC

Deuteranopia

7A8246
B9BE80
757565
E8E7DC
C3C2AE

Tritanopia

9E4342
CE8384
786768
E2E0E2
BFB4B5

Achromatopsia

595959
A1A1A1
707070
EAEAEA
C2C2C2

Shades & Tints Shades & Tints

#A3354D

Dark
Light

#D19178

Dark
Light

#786F61

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3354d;
  --color-2: #d19178;
  --color-3: #786f61;
  --color-4: #e1f4d1;
  --color-5: #becba2;
}

SCSS

$color-1: #a3354d;
$color-2: #d19178;
$color-3: #786f61;
$color-4: #e1f4d1;
$color-5: #becba2;

TAILWIND

colors: {
  'brand-1': '#a3354d',
  'brand-2': '#d19178',
  'brand-3': '#786f61',
  'brand-4': '#e1f4d1',
  'brand-5': '#becba2',
}

RGB Array

[163, 53, 77], [209, 145, 120], [120, 111, 97], [225, 244, 209], [190, 203, 162]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3354D, #D19178, #786F61, #E1F4D1, #BECBA2 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: #a3354d; --color-2: #d19178; --color-3: #786f61; --color-4: #e1f4d1; --color-5: #becba2. 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