← Back to Editor

#BA9982 · #8F9797 · #86879A · #937297 · #A3647C

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

#BA9982

Apricot · Tan · Warm Sun

HEX
#BA9982
RGB
rgb(186, 153, 130)
HSL
hsl(25, 29%, 62%)
HSB
hsb(25, 30%, 73%)
CMYK
cmyk(0%, 18%, 30%, 27%)
Oklch
oklch(70.7% 0.051 56.6)

TraditionalApricot」· PaintWarm Sun」· Creative Honey Glow

#8F9797

Ash · LightSlateGray · Silver Sand

HEX
#8F9797
RGB
rgb(143, 151, 151)
HSL
hsl(180, 4%, 58%)
HSB
hsb(180, 5%, 59%)
CMYK
cmyk(5%, 0%, 0%, 41%)
Oklch
oklch(67.0% 0.009 196.9)

TraditionalAsh」· PaintSilver Sand」· Creative Urban Concrete

#86879A

Azure · LightSlateGray · Silver Sand

HEX
#86879A
RGB
rgb(134, 135, 154)
HSL
hsl(237, 9%, 56%)
HSB
hsb(237, 13%, 60%)
CMYK
cmyk(13%, 12%, 0%, 40%)
Oklch
oklch(62.9% 0.028 283.2)

TraditionalAzure」· PaintSilver Sand」· Creative Urban Concrete

#937297

Dark Plum · Gray · Violet

HEX
#937297
RGB
rgb(147, 114, 151)
HSL
hsl(294, 15%, 52%)
HSB
hsb(294, 25%, 59%)
CMYK
cmyk(3%, 25%, 0%, 41%)
Oklch
oklch(59.7% 0.067 322.8)

TraditionalDark Plum」· PaintViolet」· Creative Blush Sunrise

#A3647C

Dark Violet · Gray · Rose Pink

HEX
#A3647C
RGB
rgb(163, 100, 124)
HSL
hsl(337, 26%, 52%)
HSB
hsb(337, 39%, 64%)
CMYK
cmyk(0%, 39%, 24%, 36%)
Oklch
oklch(58.0% 0.087 355.8)

TraditionalDark Violet」· PaintRose Pink」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BA9982
82A3BA

Analogous

BA8287
BA9982
BAB682

Triadic

BA9982
82BA99
9982BA

Split-Comp.

BA9982
82BAB6
8287BA

Tetradic

BA9982
87BA82
82A3BA
B682BA

Contrast Matrix WCAG 2.1 Contrast

BA9982
8F9797
86879A
937297
A3647C
1.1
Fail
1.3
Fail
1.6
Fail
1.7
Fail
1.1
Fail
1.2
Fail
1.4
Fail
1.5
Fail
1.3
Fail
1.2
Fail
1.2
Fail
1.3
Fail
1.6
Fail
1.4
Fail
1.2
Fail
1.1
Fail
1.7
Fail
1.5
Fail
1.3
Fail
1.1
Fail
White BG
2.6Fail
3.0Fail
3.5AA Large
4.1AA Large
4.5AA Large
Black BG
8.0AAA
7.0AAA
5.9AA
5.1AA
4.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ACAB88
929397
868695
85848E
888776

Deuteranopia

AEB089
929197
868694
87898C
8B9075

Tritanopia

B88C8D
8F9797
869291
918785
A07271

Achromatopsia

A0A0A0
959595
898989
808080
7A7A7A

Shades & Tints Shades & Tints

#BA9982

Dark
Light

#8F9797

Dark
Light

#86879A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ba9982;
  --color-2: #8f9797;
  --color-3: #86879a;
  --color-4: #937297;
  --color-5: #a3647c;
}

SCSS

$color-1: #ba9982;
$color-2: #8f9797;
$color-3: #86879a;
$color-4: #937297;
$color-5: #a3647c;

TAILWIND

colors: {
  'brand-1': '#ba9982',
  'brand-2': '#8f9797',
  'brand-3': '#86879a',
  'brand-4': '#937297',
  'brand-5': '#a3647c',
}

RGB Array

[186, 153, 130], [143, 151, 151], [134, 135, 154], [147, 114, 151], [163, 100, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BA9982, #8F9797, #86879A, #937297, #A3647C 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: #ba9982; --color-2: #8f9797; --color-3: #86879a; --color-4: #937297; --color-5: #a3647c. 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