← Back to Editor

#2A181F · #DA7578 · #CC967F · #BAA49A · #B7B2AB

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

#2A181F

Dark Violet · Black · Raspberry

HEX
#2A181F
RGB
rgb(42, 24, 31)
HSL
hsl(337, 27%, 13%)
HSB
hsb(337, 43%, 16%)
CMYK
cmyk(0%, 43%, 26%, 84%)
Oklch
oklch(23.6% 0.031 354.8)

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

#DA7578

Peach Pink · LightCoral · Coral Red

HEX
#DA7578
RGB
rgb(218, 117, 120)
HSL
hsl(358, 58%, 66%)
HSB
hsb(358, 46%, 85%)
CMYK
cmyk(0%, 46%, 45%, 15%)
Oklch
oklch(67.7% 0.126 19.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#CC967F

Apricot · DarkSalmon · Warm Sun

HEX
#CC967F
RGB
rgb(204, 150, 127)
HSL
hsl(18, 43%, 65%)
HSB
hsb(18, 38%, 80%)
CMYK
cmyk(0%, 26%, 38%, 20%)
Oklch
oklch(71.9% 0.073 44.1)

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

#BAA49A

Apricot · DarkGray · Warm Sun

HEX
#BAA49A
RGB
rgb(186, 164, 154)
HSL
hsl(19, 19%, 67%)
HSB
hsb(19, 17%, 73%)
CMYK
cmyk(0%, 12%, 17%, 27%)
Oklch
oklch(73.5% 0.030 46.0)

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

#B7B2AB

Ginger · DarkGray · Silver Sand

HEX
#B7B2AB
RGB
rgb(183, 178, 171)
HSL
hsl(35, 8%, 69%)
HSB
hsb(35, 7%, 72%)
CMYK
cmyk(0%, 3%, 7%, 28%)
Oklch
oklch(76.6% 0.011 76.6)

Traditional「Ginger」· Paint「Silver Sand」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2A181F
182A23

Analogous

2A1828
2A181F
2A1A18

Triadic

2A181F
1F2A18
181F2A

Split-Comp.

2A181F
182A1A
18282A

Tetradic

2A181F
282A18
182A23
1A182A

Contrast Matrix WCAG 2.1 Contrast

2A181F
DA7578
CC967F
BAA49A
B7B2AB
—
5.4
AA
6.6
AA
7.1
AAA
8.0
AAA
5.4
AA
—
1.2
Fail
1.3
Fail
1.5
Fail
6.6
AA
1.2
Fail
—
1.1
Fail
1.2
Fail
7.1
AAA
1.3
Fail
1.1
Fail
—
1.1
Fail
8.0
AAA
1.5
Fail
1.2
Fail
1.1
Fail
—
White BG
16.8AAA
3.1AA Large
2.5Fail
2.4Fail
2.1Fail
Black BG
1.2Fail
6.8AA
8.2AAA
8.9AAA
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

22221D
AEAD77
B5B485
B0B09C
B5B5AD

Deuteranopia

23251D
B4BC77
B8BC86
B2B39D
B5B6AD

Tritanopia

291C1C
D57777
C9898A
B99E9F
B7AEAE

Achromatopsia

1E1E1E
949494
A4A4A4
A9A9A9
B3B3B3

Shades & Tints Shades & Tints

#2A181F

Dark
Light

#DA7578

Dark
Light

#CC967F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2a181f;
  --color-2: #da7578;
  --color-3: #cc967f;
  --color-4: #baa49a;
  --color-5: #b7b2ab;
}

SCSS

$color-1: #2a181f;
$color-2: #da7578;
$color-3: #cc967f;
$color-4: #baa49a;
$color-5: #b7b2ab;

TAILWIND

colors: {
  'brand-1': '#2a181f',
  'brand-2': '#da7578',
  'brand-3': '#cc967f',
  'brand-4': '#baa49a',
  'brand-5': '#b7b2ab',
}

RGB Array

[42, 24, 31], [218, 117, 120], [204, 150, 127], [186, 164, 154], [183, 178, 171]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2A181F, #DA7578, #CC967F, #BAA49A, #B7B2AB 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: #2a181f; --color-2: #da7578; --color-3: #cc967f; --color-4: #baa49a; --color-5: #b7b2ab. 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