← Back to Editor

#ACA8A7 · #A93D30 · #806C54 · #3D422E · #302F2D

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

ProfoundPremiumWarm

Industry INDUSTRY

FinanceLuxury

UI Context UI CONTEXT

Dark ThemeCorporateData Visualization

Color Details Color Details

#ACA8A7

Ash · DarkGray · Silver Sand

HEX
#ACA8A7
RGB
rgb(172, 168, 167)
HSL
hsl(12, 3%, 66%)
HSB
hsb(12, 3%, 67%)
CMYK
cmyk(0%, 2%, 3%, 33%)
Oklch
oklch(73.5% 0.005 34.3)

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

#A93D30

Crimson · Brown · Passion Red

HEX
#A93D30
RGB
rgb(169, 61, 48)
HSL
hsl(6, 56%, 43%)
HSB
hsb(6, 72%, 66%)
CMYK
cmyk(0%, 64%, 72%, 34%)
Oklch
oklch(51.0% 0.145 29.8)

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

#806C54

Ochre · DimGray · Amber Brown

HEX
#806C54
RGB
rgb(128, 108, 84)
HSL
hsl(33, 21%, 42%)
HSB
hsb(33, 34%, 50%)
CMYK
cmyk(0%, 16%, 34%, 50%)
Oklch
oklch(54.4% 0.044 71.8)

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

#3D422E

Grass Green · DarkSlateGray · Forest Green

HEX
#3D422E
RGB
rgb(61, 66, 46)
HSL
hsl(75, 18%, 22%)
HSB
hsb(75, 30%, 26%)
CMYK
cmyk(8%, 0%, 30%, 74%)
Oklch
oklch(36.8% 0.033 119.5)

Traditional「Grass Green」· Paint「Forest Green」· Creative Blush Sunrise

#302F2D

Dark Cyan · DarkSlateGray · Dark Stone

HEX
#302F2D
RGB
rgb(48, 47, 45)
HSL
hsl(40, 3%, 18%)
HSB
hsb(40, 6%, 19%)
CMYK
cmyk(0%, 2%, 6%, 81%)
Oklch
oklch(30.5% 0.004 84.6)

Traditional「Dark Cyan」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

ACA8A7
A6AAAB

Analogous

ABA6A7
ACA8A7
ABA9A6

Triadic

ACA8A7
A6ABA7
A7A6AB

Split-Comp.

ACA8A7
A6ABA9
A6A7AB

Tetradic

ACA8A7
A7ABA6
A6AAAB
A9A6AB

Contrast Matrix WCAG 2.1 Contrast

ACA8A7
A93D30
806C54
3D422E
302F2D
—
2.6
Fail
2.1
Fail
4.4
AA Large
5.7
AA
2.6
Fail
—
1.2
Fail
1.7
Fail
2.2
Fail
2.1
Fail
1.2
Fail
—
2.1
Fail
2.7
Fail
4.4
AA Large
1.7
Fail
2.1
Fail
—
1.3
Fail
5.7
AA
2.2
Fail
2.7
Fail
1.3
Fail
—
White BG
2.4Fail
6.2AA
5.0AA
10.4AAA
13.4AAA
Black BG
8.9AAA
3.4AA Large
4.2AA Large
2.0Fail
1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAAA7
7A7933
77775A
3F3F33
30302D

Deuteranopia

ABABA7
818934
797A5B
3F3F34
30302E

Tritanopia

ACA7A7
A43636
7F5E5F
3D3738
302E2E

Achromatopsia

A9A9A9
5C5C5C
6F6F6F
3E3E3E
2F2F2F

Shades & Tints Shades & Tints

#ACA8A7

Dark
Light

#A93D30

Dark
Light

#806C54

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aca8a7;
  --color-2: #a93d30;
  --color-3: #806c54;
  --color-4: #3d422e;
  --color-5: #302f2d;
}

SCSS

$color-1: #aca8a7;
$color-2: #a93d30;
$color-3: #806c54;
$color-4: #3d422e;
$color-5: #302f2d;

TAILWIND

colors: {
  'brand-1': '#aca8a7',
  'brand-2': '#a93d30',
  'brand-3': '#806c54',
  'brand-4': '#3d422e',
  'brand-5': '#302f2d',
}

RGB Array

[172, 168, 167], [169, 61, 48], [128, 108, 84], [61, 66, 46], [48, 47, 45]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #ACA8A7, #A93D30, #806C54, #3D422E, #302F2D is ideal for: brand design, premium product pages, magazine layouts, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #aca8a7; --color-2: #a93d30; --color-3: #806c54; --color-4: #3d422e; --color-5: #302f2d. 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 finance, legal, luxury industries. Restrained colors convey professionalism and trust. 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