← Back to Editor

#A88277 · #918379 · #858A84 · #899696 · #7D9191

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

#A88277

Crimson · Gray · Passion Red

HEX
#A88277
RGB
rgb(168, 130, 119)
HSL
hsl(13, 22%, 56%)
HSB
hsb(13, 29%, 66%)
CMYK
cmyk(0%, 23%, 29%, 34%)
Oklch
oklch(64.0% 0.050 36.7)

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

#918379

Tangerine · Gray · Warm Sun

HEX
#918379
RGB
rgb(145, 131, 121)
HSL
hsl(25, 10%, 52%)
HSB
hsb(25, 17%, 57%)
CMYK
cmyk(0%, 10%, 17%, 43%)
Oklch
oklch(62.0% 0.023 57.9)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#858A84

Ash · Gray · Warm Gray

HEX
#858A84
RGB
rgb(133, 138, 132)
HSL
hsl(110, 2%, 53%)
HSB
hsb(110, 4%, 54%)
CMYK
cmyk(4%, 0%, 4%, 46%)
Oklch
oklch(62.7% 0.011 140.5)

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

#899696

Ash · LightSlateGray · Silver Sand

HEX
#899696
RGB
rgb(137, 150, 150)
HSL
hsl(180, 6%, 56%)
HSB
hsb(180, 9%, 59%)
CMYK
cmyk(9%, 0%, 0%, 41%)
Oklch
oklch(66.3% 0.015 196.8)

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

#7D9191

Slate Blue · LightSlateGray · Warm Gray

HEX
#7D9191
RGB
rgb(125, 145, 145)
HSL
hsl(180, 8%, 53%)
HSB
hsb(180, 14%, 57%)
CMYK
cmyk(14%, 0%, 0%, 43%)
Oklch
oklch(64.1% 0.023 196.6)

Traditional「Slate Blue」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A88277
769DA7

Analogous

A77684
A88277
A79976

Triadic

A88277
76A781
8176A7

Split-Comp.

A88277
76A799
7684A7

Tetradic

A88277
84A776
769DA7
9976A7

Contrast Matrix WCAG 2.1 Contrast

A88277
918379
858A84
899696
7D9191
—
1.1
Fail
1.0
Fail
1.1
Fail
1.0
Fail
1.1
Fail
—
1.0
Fail
1.2
Fail
1.1
Fail
1.0
Fail
1.0
Fail
—
1.2
Fail
1.1
Fail
1.1
Fail
1.2
Fail
1.2
Fail
—
1.1
Fail
1.0
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
White BG
3.4AA Large
3.7AA Large
3.5AA Large
3.1AA Large
3.3AA Large
Black BG
6.1AA
5.7AA
6.0AA
6.9AA
6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

98977A
8B8B7B
878785
8F8F96
868691

Deuteranopia

9A9D7A
8C8D7C
878786
8E8D96
858391

Tritanopia

A67C7C
907D7E
858787
8A9696
7E9191

Achromatopsia

8C8C8C
868686
888888
929292
8B8B8B

Shades & Tints Shades & Tints

#A88277

Dark
Light

#918379

Dark
Light

#858A84

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a88277;
  --color-2: #918379;
  --color-3: #858a84;
  --color-4: #899696;
  --color-5: #7d9191;
}

SCSS

$color-1: #a88277;
$color-2: #918379;
$color-3: #858a84;
$color-4: #899696;
$color-5: #7d9191;

TAILWIND

colors: {
  'brand-1': '#a88277',
  'brand-2': '#918379',
  'brand-3': '#858a84',
  'brand-4': '#899696',
  'brand-5': '#7d9191',
}

RGB Array

[168, 130, 119], [145, 131, 121], [133, 138, 132], [137, 150, 150], [125, 145, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A88277, #918379, #858A84, #899696, #7D9191 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: #a88277; --color-2: #918379; --color-3: #858a84; --color-4: #899696; --color-5: #7d9191. 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