← Back to Editor

#AE8F72 · #C27A52 · #BB3E4C · #594949 · #701D3B

dark

A 5-color dark palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#AE8F72

Tangerine · Gray · Warm Sun

HEX
#AE8F72
RGB
rgb(174, 143, 114)
HSL
hsl(29, 27%, 56%)
HSB
hsb(29, 34%, 68%)
CMYK
cmyk(0%, 18%, 34%, 32%)
Oklch
oklch(67.1% 0.055 64.8)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#C27A52

Tangerine · Chocolate · Warm Sun

HEX
#C27A52
RGB
rgb(194, 122, 82)
HSL
hsl(21, 48%, 54%)
HSB
hsb(21, 58%, 76%)
CMYK
cmyk(0%, 37%, 58%, 24%)
Oklch
oklch(64.7% 0.106 49.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#BB3E4C

Crimson · Brown · Passion Red

HEX
#BB3E4C
RGB
rgb(187, 62, 76)
HSL
hsl(353, 50%, 49%)
HSB
hsb(353, 67%, 73%)
CMYK
cmyk(0%, 67%, 59%, 27%)
Oklch
oklch(54.6% 0.160 17.8)

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

#594949

Crimson · DarkSlateGray · Wine Red

HEX
#594949
RGB
rgb(89, 73, 73)
HSL
hsl(0, 10%, 32%)
HSB
hsb(0, 18%, 35%)
CMYK
cmyk(0%, 18%, 18%, 65%)
Oklch
oklch(42.2% 0.022 18.0)

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

#701D3B

Dark Violet · Brown · Camellia

HEX
#701D3B
RGB
rgb(112, 29, 59)
HSL
hsl(338, 59%, 28%)
HSB
hsb(338, 74%, 44%)
CMYK
cmyk(0%, 74%, 47%, 56%)
Oklch
oklch(37.5% 0.118 2.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AE8F72
7190AD

Analogous

AD7172
AE8F72
ADAC71

Triadic

AE8F72
71AD8E
8E71AD

Split-Comp.

AE8F72
71ADAC
7172AD

Tetradic

AE8F72
72AD71
7190AD
AC71AD

Contrast Matrix WCAG 2.1 Contrast

AE8F72
C27A52
BB3E4C
594949
701D3B
—
1.1
Fail
1.8
Fail
2.8
Fail
3.6
AA Large
1.1
Fail
—
1.6
Fail
2.5
Fail
3.2
AA Large
1.8
Fail
1.6
Fail
—
1.6
Fail
2.0
Fail
2.8
Fail
2.5
Fail
1.6
Fail
—
1.3
Fail
3.6
AA Large
3.2
AA Large
2.0
Fail
1.3
Fail
—
White BG
3.0AA Large
3.4AA Large
5.4AA
8.5AAA
10.9AAA
Black BG
7.0AA
6.2AA
3.9AA Large
2.5Fail
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A1A079
A3A25C
858449
525249
4C4B34

Deuteranopia

A2A57B
A7AC5E
8C9648
535449
515732

Tritanopia

AC7F80
BE6365
B54645
584949
6C2E2D

Achromatopsia

959595
8B8B8B
656565
4E4E4E
393939

Shades & Tints Shades & Tints

#AE8F72

Dark
Light

#C27A52

Dark
Light

#BB3E4C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ae8f72;
  --color-2: #c27a52;
  --color-3: #bb3e4c;
  --color-4: #594949;
  --color-5: #701d3b;
}

SCSS

$color-1: #ae8f72;
$color-2: #c27a52;
$color-3: #bb3e4c;
$color-4: #594949;
$color-5: #701d3b;

TAILWIND

colors: {
  'brand-1': '#ae8f72',
  'brand-2': '#c27a52',
  'brand-3': '#bb3e4c',
  'brand-4': '#594949',
  'brand-5': '#701d3b',
}

RGB Array

[174, 143, 114], [194, 122, 82], [187, 62, 76], [89, 73, 73], [112, 29, 59]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #AE8F72, #C27A52, #BB3E4C, #594949, #701D3B is ideal for: corporate websites, product showcases, portfolios. 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: #ae8f72; --color-2: #c27a52; --color-3: #bb3e4c; --color-4: #594949; --color-5: #701d3b. 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. 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 dark-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