← Back to Editor

#2B152B · #585B63 · #84A19A · #99A58F · #ADA884

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

#2B152B

Rose Purple · Black · Dark Purple

HEX
#2B152B
RGB
rgb(43, 21, 43)
HSL
hsl(300, 34%, 13%)
HSB
hsb(300, 51%, 17%)
CMYK
cmyk(0%, 51%, 0%, 83%)
Oklch
oklch(23.7% 0.051 327.0)

Traditional「Rose Purple」· Paint「Dark Purple」· Creative Blush Sunrise

#585B63

Ink Gray · DimGray · Charcoal

HEX
#585B63
RGB
rgb(88, 91, 99)
HSL
hsl(224, 6%, 37%)
HSB
hsb(224, 11%, 39%)
CMYK
cmyk(11%, 8%, 0%, 61%)
Oklch
oklch(47.1% 0.013 269.4)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#84A19A

Mineral Blue · LightSlateGray · Lake Green

HEX
#84A19A
RGB
rgb(132, 161, 154)
HSL
hsl(166, 13%, 57%)
HSB
hsb(166, 18%, 63%)
CMYK
cmyk(18%, 0%, 4%, 37%)
Oklch
oklch(68.5% 0.034 179.0)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#99A58F

Celadon · DarkSeaGreen · Olive Green

HEX
#99A58F
RGB
rgb(153, 165, 143)
HSL
hsl(93, 11%, 60%)
HSB
hsb(93, 13%, 65%)
CMYK
cmyk(7%, 0%, 13%, 35%)
Oklch
oklch(70.6% 0.034 130.7)

Traditional「Celadon」· Paint「Olive Green」· Creative Blush Sunrise

#ADA884

Autumn Sage · DarkGray · Sunflower

HEX
#ADA884
RGB
rgb(173, 168, 132)
HSL
hsl(53, 20%, 60%)
HSB
hsb(53, 24%, 68%)
CMYK
cmyk(0%, 3%, 24%, 32%)
Oklch
oklch(72.6% 0.050 100.9)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

2B152B
162C16

Analogous

21162C
2B152B
2C1621

Triadic

2B152B
2C2C16
162C2C

Split-Comp.

2B152B
212C16
162C21

Tetradic

2B152B
2C2116
162C16
16212C

Contrast Matrix WCAG 2.1 Contrast

2B152B
585B63
84A19A
99A58F
ADA884
—
2.5
Fail
6.1
AA
6.5
AA
7.0
AA
2.5
Fail
—
2.4
Fail
2.6
Fail
2.8
Fail
6.1
AA
2.4
Fail
—
1.1
Fail
1.2
Fail
6.5
AA
2.6
Fail
1.1
Fail
—
1.1
Fail
7.0
AA
2.8
Fail
1.2
Fail
1.1
Fail
—
White BG
16.9AAA
6.8AA
2.8Fail
2.6Fail
2.4Fail
Black BG
1.2Fail
3.1AA Large
7.5AAA
8.1AAA
8.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

212126
595961
91919C
9E9E94
ABAB8D

Deuteranopia

232424
595961
8F8D9C
9E9D96
ABAC8F

Tritanopia

2A2121
58605F
859D9D
9A9999
AD9495

Achromatopsia

1E1E1E
5B5B5B
989898
9F9F9F
A5A5A5

Shades & Tints Shades & Tints

#2B152B

Dark
Light

#585B63

Dark
Light

#84A19A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #2b152b;
  --color-2: #585b63;
  --color-3: #84a19a;
  --color-4: #99a58f;
  --color-5: #ada884;
}

SCSS

$color-1: #2b152b;
$color-2: #585b63;
$color-3: #84a19a;
$color-4: #99a58f;
$color-5: #ada884;

TAILWIND

colors: {
  'brand-1': '#2b152b',
  'brand-2': '#585b63',
  'brand-3': '#84a19a',
  'brand-4': '#99a58f',
  'brand-5': '#ada884',
}

RGB Array

[43, 21, 43], [88, 91, 99], [132, 161, 154], [153, 165, 143], [173, 168, 132]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #2B152B, #585B63, #84A19A, #99A58F, #ADA884 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: #2b152b; --color-2: #585b63; --color-3: #84a19a; --color-4: #99a58f; --color-5: #ada884. 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