← Back to Editor

#A4AAA8 · #AC988D · #B4835A · #8D4046 · #18222C

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#A4AAA8

Ash · DarkGray · Silver Sand

HEX
#A4AAA8
RGB
rgb(164, 170, 168)
HSL
hsl(160, 3%, 65%)
HSB
hsb(160, 4%, 67%)
CMYK
cmyk(4%, 0%, 1%, 33%)
Oklch
oklch(73.3% 0.007 174.3)

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

#AC988D

Apricot · DarkGray · Warm Sun

HEX
#AC988D
RGB
rgb(172, 152, 141)
HSL
hsl(21, 16%, 61%)
HSB
hsb(21, 18%, 67%)
CMYK
cmyk(0%, 12%, 18%, 33%)
Oklch
oklch(69.4% 0.029 50.7)

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

#B4835A

Tangerine · Gray · Warm Sun

HEX
#B4835A
RGB
rgb(180, 131, 90)
HSL
hsl(27, 38%, 53%)
HSB
hsb(27, 50%, 71%)
CMYK
cmyk(0%, 27%, 50%, 29%)
Oklch
oklch(64.9% 0.083 60.5)

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

#8D4046

Crimson · Sienna · Wine Red

HEX
#8D4046
RGB
rgb(141, 64, 70)
HSL
hsl(355, 38%, 40%)
HSB
hsb(355, 55%, 55%)
CMYK
cmyk(0%, 55%, 50%, 45%)
Oklch
oklch(47.3% 0.105 17.2)

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

#18222C

Indigo · Black · Deep Sea Blue

HEX
#18222C
RGB
rgb(24, 34, 44)
HSL
hsl(210, 29%, 13%)
HSB
hsb(210, 45%, 17%)
CMYK
cmyk(45%, 23%, 0%, 83%)
Oklch
oklch(24.7% 0.024 248.8)

Traditional「Indigo」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A4AAA8
A8A3A5

Analogous

A3A8A4
A4AAA8
A3A8A8

Triadic

A4AAA8
A7A3A8
A8A7A3

Split-Comp.

A4AAA8
A8A3A8
A8A4A3

Tetradic

A4AAA8
A4A3A8
A8A3A5
A8A8A3

Contrast Matrix WCAG 2.1 Contrast

A4AAA8
AC988D
B4835A
8D4046
18222C
—
1.2
Fail
1.4
Fail
3.0
AA Large
6.8
AA
1.2
Fail
—
1.2
Fail
2.6
Fail
5.9
AA
1.4
Fail
1.2
Fail
—
2.1
Fail
4.9
AA
3.0
AA Large
2.6
Fail
2.1
Fail
—
2.3
Fail
6.8
AA
5.9
AA
4.9
AA
2.3
Fail
—
White BG
2.4Fail
2.8Fail
3.3AA Large
7.1AAA
16.1AAA
Black BG
8.9AAA
7.6AAA
6.3AA
3.0Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A7A8
A3A390
9F9E64
6C6B45
1C1C2A

Deuteranopia

A6A6A9
A5A690
A2A566
707644
1C1B29

Tritanopia

A4A9A9
AB9292
B26C6D
894343
182827

Achromatopsia

A8A8A8
9D9D9D
8D8D8D
585858
202020

Shades & Tints Shades & Tints

#A4AAA8

Dark
Light

#AC988D

Dark
Light

#B4835A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a4aaa8;
  --color-2: #ac988d;
  --color-3: #b4835a;
  --color-4: #8d4046;
  --color-5: #18222c;
}

SCSS

$color-1: #a4aaa8;
$color-2: #ac988d;
$color-3: #b4835a;
$color-4: #8d4046;
$color-5: #18222c;

TAILWIND

colors: {
  'brand-1': '#a4aaa8',
  'brand-2': '#ac988d',
  'brand-3': '#b4835a',
  'brand-4': '#8d4046',
  'brand-5': '#18222c',
}

RGB Array

[164, 170, 168], [172, 152, 141], [180, 131, 90], [141, 64, 70], [24, 34, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A4AAA8, #AC988D, #B4835A, #8D4046, #18222C is ideal for: brand design, premium product pages, magazine layouts, 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: #a4aaa8; --color-2: #ac988d; --color-3: #b4835a; --color-4: #8d4046; --color-5: #18222c. 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. 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