← Back to Editor

#A3676C · #BC757B · #D08A91 · #AAA59B · #999386

A 5-color palette 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

#A3676C

Crimson · Gray · Passion Red

HEX
#A3676C
RGB
rgb(163, 103, 108)
HSL
hsl(355, 25%, 52%)
HSB
hsb(355, 37%, 64%)
CMYK
cmyk(0%, 37%, 34%, 36%)
Oklch
oklch(58.0% 0.078 14.3)

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

#BC757B

Crimson · LightCoral · Passion Red

HEX
#BC757B
RGB
rgb(188, 117, 123)
HSL
hsl(355, 35%, 60%)
HSB
hsb(355, 38%, 74%)
CMYK
cmyk(0%, 38%, 35%, 26%)
Oklch
oklch(64.0% 0.090 14.4)

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

#D08A91

Peach Pink · DarkSalmon · Coral Red

HEX
#D08A91
RGB
rgb(208, 138, 145)
HSL
hsl(354, 43%, 68%)
HSB
hsb(354, 34%, 82%)
CMYK
cmyk(0%, 34%, 30%, 18%)
Oklch
oklch(70.6% 0.086 12.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#AAA59B

Ginger · DarkGray · Silver Sand

HEX
#AAA59B
RGB
rgb(170, 165, 155)
HSL
hsl(40, 8%, 64%)
HSB
hsb(40, 9%, 67%)
CMYK
cmyk(0%, 3%, 9%, 33%)
Oklch
oklch(72.3% 0.015 84.6)

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

#999386

Ginger · Gray · Silver Sand

HEX
#999386
RGB
rgb(153, 147, 134)
HSL
hsl(41, 9%, 56%)
HSB
hsb(41, 12%, 60%)
CMYK
cmyk(0%, 4%, 12%, 40%)
Oklch
oklch(66.5% 0.020 86.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3676C
66A39E

Analogous

A3668A
A3676C
A38066

Triadic

A3676C
6BA366
666BA3

Split-Comp.

A3676C
66A37F
668AA3

Tetradic

A3676C
8AA366
66A39E
8066A3

Contrast Matrix WCAG 2.1 Contrast

A3676C
BC757B
D08A91
AAA59B
999386
—
1.3
Fail
1.6
Fail
1.8
Fail
1.5
Fail
1.3
Fail
—
1.3
Fail
1.4
Fail
1.2
Fail
1.6
Fail
1.3
Fail
—
1.1
Fail
1.1
Fail
1.8
Fail
1.4
Fail
1.1
Fail
—
1.2
Fail
1.5
Fail
1.2
Fail
1.1
Fail
1.2
Fail
—
White BG
4.5AA Large
3.5AA Large
2.7Fail
2.5Fail
3.1AA Large
Black BG
4.7AA
6.0AA
7.7AAA
8.6AAA
6.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

89886B
9D9D7A
B2B18F
A8A89D
969689

Deuteranopia

8D916B
A1A779
B6BB8F
A8A99E
97978A

Tritanopia

A06A6A
B87878
CD8E8E
AA9FA0
998C8C

Achromatopsia

7A7A7A
8B8B8B
A0A0A0
A5A5A5
939393

Shades & Tints Shades & Tints

#A3676C

Dark
Light

#BC757B

Dark
Light

#D08A91

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3676c;
  --color-2: #bc757b;
  --color-3: #d08a91;
  --color-4: #aaa59b;
  --color-5: #999386;
}

SCSS

$color-1: #a3676c;
$color-2: #bc757b;
$color-3: #d08a91;
$color-4: #aaa59b;
$color-5: #999386;

TAILWIND

colors: {
  'brand-1': '#a3676c',
  'brand-2': '#bc757b',
  'brand-3': '#d08a91',
  'brand-4': '#aaa59b',
  'brand-5': '#999386',
}

RGB Array

[163, 103, 108], [188, 117, 123], [208, 138, 145], [170, 165, 155], [153, 147, 134]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3676C, #BC757B, #D08A91, #AAA59B, #999386 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: #a3676c; --color-2: #bc757b; --color-3: #d08a91; --color-4: #aaa59b; --color-5: #999386. 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