← Back to Editor

#5D4156 · #A8CABB · #838688 · #CAD7B1 · #EBE3A9

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

#5D4156

Rose Purple · DimGray · Eggplant

HEX
#5D4156
RGB
rgb(93, 65, 86)
HSL
hsl(315, 18%, 31%)
HSB
hsb(315, 30%, 36%)
CMYK
cmyk(0%, 30%, 8%, 64%)
Oklch
oklch(41.4% 0.050 335.8)

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

#A8CABB

Jade · Silver · Apple Green

HEX
#A8CABB
RGB
rgb(168, 202, 187)
HSL
hsl(154, 24%, 73%)
HSB
hsb(154, 17%, 79%)
CMYK
cmyk(17%, 0%, 7%, 21%)
Oklch
oklch(81.0% 0.042 166.8)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#838688

Ash · Gray · Warm Gray

HEX
#838688
RGB
rgb(131, 134, 136)
HSL
hsl(204, 2%, 52%)
HSB
hsb(204, 4%, 53%)
CMYK
cmyk(4%, 1%, 0%, 47%)
Oklch
oklch(61.8% 0.005 236.5)

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

#CAD7B1

Willow Green · Silver · Apple Green

HEX
#CAD7B1
RGB
rgb(202, 215, 177)
HSL
hsl(81, 32%, 77%)
HSB
hsb(81, 18%, 84%)
CMYK
cmyk(6%, 0%, 18%, 16%)
Oklch
oklch(85.9% 0.053 122.9)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#EBE3A9

Fresh Green · Wheat · Lemon Cream

HEX
#EBE3A9
RGB
rgb(235, 227, 169)
HSL
hsl(53, 62%, 79%)
HSB
hsb(53, 28%, 92%)
CMYK
cmyk(0%, 3%, 28%, 8%)
Oklch
oklch(90.8% 0.075 101.1)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5D4156
415D48

Analogous

56415D
5D4156
5D4148

Triadic

5D4156
565D41
41565D

Split-Comp.

5D4156
485D41
415D56

Tetradic

5D4156
5D5641
415D48
41485D

Contrast Matrix WCAG 2.1 Contrast

5D4156
A8CABB
838688
CAD7B1
EBE3A9
—
5.0
AA
2.4
Fail
5.9
AA
6.8
AA
5.0
AA
—
2.1
Fail
1.2
Fail
1.4
Fail
2.4
Fail
2.1
Fail
—
2.4
Fail
2.8
Fail
5.9
AA
1.2
Fail
2.4
Fail
—
1.2
Fail
6.8
AA
1.4
Fail
2.8
Fail
1.2
Fail
—
White BG
8.9AAA
1.8Fail
3.7AA Large
1.5Fail
1.3Fail
Black BG
2.4Fail
11.8AAA
5.7AA
13.9AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

515151
B7B7BF
848488
D0D0BA
E8E7B7

Deuteranopia

535550
B5B2C0
848487
CFCEBC
E8E9BA

Tritanopia

5C4D4C
AAC1C2
838787
CBC1C3
EBC2C5

Achromatopsia

4C4C4C
BEBEBE
858585
CFCFCF
DFDFDF

Shades & Tints Shades & Tints

#5D4156

Dark
Light

#A8CABB

Dark
Light

#838688

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5d4156;
  --color-2: #a8cabb;
  --color-3: #838688;
  --color-4: #cad7b1;
  --color-5: #ebe3a9;
}

SCSS

$color-1: #5d4156;
$color-2: #a8cabb;
$color-3: #838688;
$color-4: #cad7b1;
$color-5: #ebe3a9;

TAILWIND

colors: {
  'brand-1': '#5d4156',
  'brand-2': '#a8cabb',
  'brand-3': '#838688',
  'brand-4': '#cad7b1',
  'brand-5': '#ebe3a9',
}

RGB Array

[93, 65, 86], [168, 202, 187], [131, 134, 136], [202, 215, 177], [235, 227, 169]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5D4156, #A8CABB, #838688, #CAD7B1, #EBE3A9 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: #5d4156; --color-2: #a8cabb; --color-3: #838688; --color-4: #cad7b1; --color-5: #ebe3a9. 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