← Back to Editor

#CCA48B · #AE3A2D · #853E5E · #4C253A · #2E0D14

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

#CCA48B

Apricot · Tan · Warm Sun

HEX
#CCA48B
RGB
rgb(204, 164, 139)
HSL
hsl(23, 39%, 67%)
HSB
hsb(23, 32%, 80%)
CMYK
cmyk(0%, 20%, 32%, 20%)
Oklch
oklch(74.9% 0.059 53.6)

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

#AE3A2D

Crimson · Brown · Passion Red

HEX
#AE3A2D
RGB
rgb(174, 58, 45)
HSL
hsl(6, 59%, 43%)
HSB
hsb(6, 74%, 68%)
CMYK
cmyk(0%, 67%, 74%, 32%)
Oklch
oklch(51.4% 0.154 29.7)

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

#853E5E

Dark Violet · DimGray · Camellia

HEX
#853E5E
RGB
rgb(133, 62, 94)
HSL
hsl(333, 36%, 38%)
HSB
hsb(333, 53%, 52%)
CMYK
cmyk(0%, 53%, 29%, 48%)
Oklch
oklch(46.6% 0.104 353.6)

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

#4C253A

Rose Purple · DarkSlateGray · Raspberry

HEX
#4C253A
RGB
rgb(76, 37, 58)
HSL
hsl(328, 35%, 22%)
HSB
hsb(328, 51%, 30%)
CMYK
cmyk(0%, 51%, 24%, 70%)
Oklch
oklch(32.5% 0.066 347.9)

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

#2E0D14

Crimson · Black · Deep Berry

HEX
#2E0D14
RGB
rgb(46, 13, 20)
HSL
hsl(347, 56%, 12%)
HSB
hsb(347, 72%, 18%)
CMYK
cmyk(0%, 72%, 57%, 82%)
Oklch
oklch(21.6% 0.055 9.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCA48B
8AB3CC

Analogous

CC8A92
CCA48B
CCC48A

Triadic

CCA48B
8ACCA3
A38ACC

Split-Comp.

CCA48B
8ACCC4
8A92CC

Tetradic

CCA48B
92CC8A
8AB3CC
C48ACC

Contrast Matrix WCAG 2.1 Contrast

CCA48B
AE3A2D
853E5E
4C253A
2E0D14
—
2.7
Fail
3.2
AA Large
5.7
AA
7.8
AAA
2.7
Fail
—
1.2
Fail
2.1
Fail
2.9
Fail
3.2
AA Large
1.2
Fail
—
1.7
Fail
2.4
Fail
5.7
AA
2.1
Fail
1.7
Fail
—
1.4
Fail
7.8
AAA
2.9
Fail
2.4
Fail
1.4
Fail
—
White BG
2.3Fail
6.1AA
7.4AAA
12.9AAA
17.7AAA
Black BG
9.3AAA
3.4AA Large
2.8Fail
1.6Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

BBBA91
7C7B30
666656
3B3B35
201F12

Deuteranopia

BDC093
838B31
6A7054
3D4034
222412

Tritanopia

CA9697
A83333
81504F
4A3130
2C1111

Achromatopsia

ADADAD
5B5B5B
575757
333333
181818

Shades & Tints Shades & Tints

#CCA48B

Dark
Light

#AE3A2D

Dark
Light

#853E5E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cca48b;
  --color-2: #ae3a2d;
  --color-3: #853e5e;
  --color-4: #4c253a;
  --color-5: #2e0d14;
}

SCSS

$color-1: #cca48b;
$color-2: #ae3a2d;
$color-3: #853e5e;
$color-4: #4c253a;
$color-5: #2e0d14;

TAILWIND

colors: {
  'brand-1': '#cca48b',
  'brand-2': '#ae3a2d',
  'brand-3': '#853e5e',
  'brand-4': '#4c253a',
  'brand-5': '#2e0d14',
}

RGB Array

[204, 164, 139], [174, 58, 45], [133, 62, 94], [76, 37, 58], [46, 13, 20]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CCA48B, #AE3A2D, #853E5E, #4C253A, #2E0D14 is ideal for: tech websites, dark mode UIs, game UIs, 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: #cca48b; --color-2: #ae3a2d; --color-3: #853e5e; --color-4: #4c253a; --color-5: #2e0d14. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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