← Back to Editor

#544540 · #897169 · #9B908D · #CEB3AB · #EAD8D2

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 LibraryData Visualization

Color Details Color Details

#544540

Tangerine · DarkSlateGray · Amber Brown

HEX
#544540
RGB
rgb(84, 69, 64)
HSL
hsl(15, 14%, 29%)
HSB
hsb(15, 24%, 33%)
CMYK
cmyk(0%, 18%, 24%, 67%)
Oklch
oklch(40.4% 0.022 39.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#897169

Tangerine · Gray · Amber Brown

HEX
#897169
RGB
rgb(137, 113, 105)
HSL
hsl(15, 13%, 47%)
HSB
hsb(15, 23%, 54%)
CMYK
cmyk(0%, 18%, 23%, 46%)
Oklch
oklch(56.9% 0.033 39.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#9B908D

Ash · Gray · Silver Sand

HEX
#9B908D
RGB
rgb(155, 144, 141)
HSL
hsl(13, 7%, 58%)
HSB
hsb(13, 9%, 61%)
CMYK
cmyk(0%, 7%, 9%, 39%)
Oklch
oklch(66.2% 0.014 35.7)

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

#CEB3AB

Peach Pink · Silver · Coral Red

HEX
#CEB3AB
RGB
rgb(206, 179, 171)
HSL
hsl(14, 26%, 74%)
HSB
hsb(14, 17%, 81%)
CMYK
cmyk(0%, 13%, 17%, 19%)
Oklch
oklch(78.8% 0.033 37.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#EAD8D2

Apricot · LightGray · Peach Orange

HEX
#EAD8D2
RGB
rgb(234, 216, 210)
HSL
hsl(15, 36%, 87%)
HSB
hsb(15, 10%, 92%)
CMYK
cmyk(0%, 8%, 10%, 8%)
Oklch
oklch(89.5% 0.022 39.4)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

544540
404F54

Analogous

544045
544540
544F40

Triadic

544540
405445
454054

Split-Comp.

544540
40544F
404554

Tetradic

544540
455440
404F54
4F4054

Contrast Matrix WCAG 2.1 Contrast

544540
897169
9B908D
CEB3AB
EAD8D2
—
2.0
Fail
2.9
Fail
4.6
AA
6.6
AA
2.0
Fail
—
1.5
Fail
2.3
Fail
3.3
AA Large
2.9
Fail
1.5
Fail
—
1.6
Fail
2.3
Fail
4.6
AA
2.3
Fail
1.6
Fail
—
1.4
Fail
6.6
AA
3.3
AA Large
2.3
Fail
1.4
Fail
—
White BG
9.1AAA
4.5AA
3.1AA Large
2.0Fail
1.4Fail
Black BG
2.3Fail
4.6AA
6.8AA
10.7AAA
15.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4D41
7F7E6B
96968E
C2C2AD
E2E2D3

Deuteranopia

4E5042
80826B
97988E
C4C6AD
E3E5D4

Tritanopia

534242
886C6D
9A8E8E
CDAEAF
E9D5D5

Achromatopsia

494949
777777
939393
BABABA
DDDDDD

Shades & Tints Shades & Tints

#544540

Dark
Light

#897169

Dark
Light

#9B908D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #544540;
  --color-2: #897169;
  --color-3: #9b908d;
  --color-4: #ceb3ab;
  --color-5: #ead8d2;
}

SCSS

$color-1: #544540;
$color-2: #897169;
$color-3: #9b908d;
$color-4: #ceb3ab;
$color-5: #ead8d2;

TAILWIND

colors: {
  'brand-1': '#544540',
  'brand-2': '#897169',
  'brand-3': '#9b908d',
  'brand-4': '#ceb3ab',
  'brand-5': '#ead8d2',
}

RGB Array

[84, 69, 64], [137, 113, 105], [155, 144, 141], [206, 179, 171], [234, 216, 210]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #544540, #897169, #9B908D, #CEB3AB, #EAD8D2 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: #544540; --color-2: #897169; --color-3: #9b908d; --color-4: #ceb3ab; --color-5: #ead8d2. 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