← Back to Editor

#816B6E · #B97B88 · #A4A2AF · #AEA9A5 · #D4CAC1

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 Library

Color Details Color Details

#816B6E

Crimson · DimGray · Warm Gray

HEX
#816B6E
RGB
rgb(129, 107, 110)
HSL
hsl(352, 9%, 46%)
HSB
hsb(352, 17%, 51%)
CMYK
cmyk(0%, 17%, 15%, 49%)
Oklch
oklch(55.0% 0.028 8.8)

Traditional「Crimson」· Paint「Warm Gray」· Creative Urban Concrete

#B97B88

Crimson · LightCoral · Passion Red

HEX
#B97B88
RGB
rgb(185, 123, 136)
HSL
hsl(347, 31%, 60%)
HSB
hsb(347, 34%, 73%)
CMYK
cmyk(0%, 34%, 26%, 27%)
Oklch
oklch(65.0% 0.079 5.8)

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

#A4A2AF

Wisteria · DarkGray · Silver Sand

HEX
#A4A2AF
RGB
rgb(164, 162, 175)
HSL
hsl(249, 8%, 66%)
HSB
hsb(249, 7%, 69%)
CMYK
cmyk(6%, 7%, 0%, 31%)
Oklch
oklch(71.8% 0.019 293.0)

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

#AEA9A5

Ash · DarkGray · Silver Sand

HEX
#AEA9A5
RGB
rgb(174, 169, 165)
HSL
hsl(27, 5%, 66%)
HSB
hsb(27, 5%, 68%)
CMYK
cmyk(0%, 3%, 5%, 32%)
Oklch
oklch(73.8% 0.008 61.4)

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

#D4CAC1

Apricot · LightGray · Peach Orange

HEX
#D4CAC1
RGB
rgb(212, 202, 193)
HSL
hsl(28, 18%, 79%)
HSB
hsb(28, 9%, 83%)
CMYK
cmyk(0%, 5%, 9%, 17%)
Oklch
oklch(84.5% 0.017 64.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

816B6E
6B807D

Analogous

806B78
816B6E
80726B

Triadic

816B6E
6E806B
6B6E80

Split-Comp.

816B6E
6B8072
6B7880

Tetradic

816B6E
78806B
6B807D
726B80

Contrast Matrix WCAG 2.1 Contrast

816B6E
B97B88
A4A2AF
AEA9A5
D4CAC1
—
1.5
Fail
2.0
Fail
2.1
Fail
3.1
AA Large
1.5
Fail
—
1.3
Fail
1.4
Fail
2.1
Fail
2.0
Fail
1.3
Fail
—
1.1
Fail
1.6
Fail
2.1
Fail
1.4
Fail
1.1
Fail
—
1.4
Fail
3.1
AA Large
2.1
Fail
1.6
Fail
1.4
Fail
—
White BG
4.9AA
3.4AA Large
2.5Fail
2.3Fail
1.6Fail
Black BG
4.3AA Large
6.3AA
8.4AAA
9.0AAA
13.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

77776D
9E9E85
A3A3AC
ACACA6
D0D0C3

Deuteranopia

797A6D
A2A684
A3A3AB
ACADA6
D0D1C4

Tritanopia

806D6D
B68282
A4A9A9
AEA7A7
D3C5C5

Achromatopsia

727272
8F8F8F
A4A4A4
AAAAAA
CCCCCC

Shades & Tints Shades & Tints

#816B6E

Dark
Light

#B97B88

Dark
Light

#A4A2AF

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #816b6e;
  --color-2: #b97b88;
  --color-3: #a4a2af;
  --color-4: #aea9a5;
  --color-5: #d4cac1;
}

SCSS

$color-1: #816b6e;
$color-2: #b97b88;
$color-3: #a4a2af;
$color-4: #aea9a5;
$color-5: #d4cac1;

TAILWIND

colors: {
  'brand-1': '#816b6e',
  'brand-2': '#b97b88',
  'brand-3': '#a4a2af',
  'brand-4': '#aea9a5',
  'brand-5': '#d4cac1',
}

RGB Array

[129, 107, 110], [185, 123, 136], [164, 162, 175], [174, 169, 165], [212, 202, 193]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #816B6E, #B97B88, #A4A2AF, #AEA9A5, #D4CAC1 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. 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: #816b6e; --color-2: #b97b88; --color-3: #a4a2af; --color-4: #aea9a5; --color-5: #d4cac1. 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 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