← Back to Editor

#A0817F · #746673 · #555E6D · #DCD2B9 · #A6BCC9

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

#A0817F

Crimson · Gray · Passion Red

HEX
#A0817F
RGB
rgb(160, 129, 127)
HSL
hsl(4, 15%, 56%)
HSB
hsb(4, 21%, 63%)
CMYK
cmyk(0%, 19%, 21%, 37%)
Oklch
oklch(63.2% 0.039 22.5)

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

#746673

Ink Gray · DimGray · Warm Gray

HEX
#746673
RGB
rgb(116, 102, 115)
HSL
hsl(304, 6%, 43%)
HSB
hsb(304, 12%, 45%)
CMYK
cmyk(0%, 12%, 1%, 55%)
Oklch
oklch(52.8% 0.026 328.2)

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

#555E6D

Indigo · DimGray · Prussian Blue

HEX
#555E6D
RGB
rgb(85, 94, 109)
HSL
hsl(218, 12%, 38%)
HSB
hsb(218, 22%, 43%)
CMYK
cmyk(22%, 14%, 0%, 57%)
Oklch
oklch(48.0% 0.027 260.7)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#DCD2B9

Goose Yellow · LightGray · Lemon Cream

HEX
#DCD2B9
RGB
rgb(220, 210, 185)
HSL
hsl(43, 33%, 79%)
HSB
hsb(43, 16%, 86%)
CMYK
cmyk(0%, 5%, 16%, 14%)
Oklch
oklch(86.5% 0.035 88.8)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#A6BCC9

Sky Blue · LightSteelBlue · Cobalt Blue

HEX
#A6BCC9
RGB
rgb(166, 188, 201)
HSL
hsl(202, 24%, 72%)
HSB
hsb(202, 17%, 79%)
CMYK
cmyk(17%, 6%, 0%, 21%)
Oklch
oklch(78.3% 0.030 233.7)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A0817F
7E9DA0

Analogous

A07E8D
A0817F
A0917E

Triadic

A0817F
7EA080
807EA0

Split-Comp.

A0817F
7EA091
7E8DA0

Tetradic

A0817F
8DA07E
7E9DA0
917EA0

Contrast Matrix WCAG 2.1 Contrast

A0817F
746673
555E6D
DCD2B9
A6BCC9
—
1.5
Fail
1.9
Fail
2.4
Fail
1.8
Fail
1.5
Fail
—
1.2
Fail
3.6
AA Large
2.7
Fail
1.9
Fail
1.2
Fail
—
4.4
AA Large
3.3
AA Large
2.4
Fail
3.6
AA Large
4.4
AA Large
—
1.3
Fail
1.8
Fail
2.7
Fail
3.3
AA Large
1.3
Fail
—
White BG
3.5AA Large
5.4AA
6.5AA
1.5Fail
2.0Fail
Black BG
5.9AA
3.9AA Large
3.2AA Large
14.0AAA
10.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

93927F
6E6E70
595969
D8D8BF
B0B0C6

Deuteranopia

949780
6F706F
585869
D8D9C1
AEADC5

Tritanopia

9E8080
736D6D
556766
DCC4C5
A7C3C3

Achromatopsia

8A8A8A
6C6C6C
5D5D5D
D2D2D2
B7B7B7

Shades & Tints Shades & Tints

#A0817F

Dark
Light

#746673

Dark
Light

#555E6D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a0817f;
  --color-2: #746673;
  --color-3: #555e6d;
  --color-4: #dcd2b9;
  --color-5: #a6bcc9;
}

SCSS

$color-1: #a0817f;
$color-2: #746673;
$color-3: #555e6d;
$color-4: #dcd2b9;
$color-5: #a6bcc9;

TAILWIND

colors: {
  'brand-1': '#a0817f',
  'brand-2': '#746673',
  'brand-3': '#555e6d',
  'brand-4': '#dcd2b9',
  'brand-5': '#a6bcc9',
}

RGB Array

[160, 129, 127], [116, 102, 115], [85, 94, 109], [220, 210, 185], [166, 188, 201]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A0817F, #746673, #555E6D, #DCD2B9, #A6BCC9 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: #a0817f; --color-2: #746673; --color-3: #555e6d; --color-4: #dcd2b9; --color-5: #a6bcc9. 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