← Back to Editor

#8C5D64 · #858575 · #86978E · #708882 · #8FCFD0

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

#8C5D64

Crimson · DimGray · Passion Red

HEX
#8C5D64
RGB
rgb(140, 93, 100)
HSL
hsl(351, 20%, 46%)
HSB
hsb(351, 34%, 55%)
CMYK
cmyk(0%, 34%, 29%, 45%)
Oklch
oklch(53.1% 0.062 9.6)

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

#858575

Ink Gray · Gray · Warm Gray

HEX
#858575
RGB
rgb(133, 133, 117)
HSL
hsl(60, 6%, 49%)
HSB
hsb(60, 12%, 52%)
CMYK
cmyk(0%, 0%, 12%, 48%)
Oklch
oklch(61.2% 0.023 107.1)

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

#86978E

Celadon · LightSlateGray · Silver Sand

HEX
#86978E
RGB
rgb(134, 151, 142)
HSL
hsl(148, 8%, 56%)
HSB
hsb(148, 11%, 59%)
CMYK
cmyk(11%, 0%, 6%, 41%)
Oklch
oklch(66.0% 0.023 162.7)

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

#708882

Mineral Blue · SlateGray · Mint Ice

HEX
#708882
RGB
rgb(112, 136, 130)
HSL
hsl(165, 10%, 49%)
HSB
hsb(165, 18%, 53%)
CMYK
cmyk(18%, 0%, 4%, 47%)
Oklch
oklch(60.6% 0.029 178.4)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#8FCFD0

Sky Blue · SkyBlue · Lake Green

HEX
#8FCFD0
RGB
rgb(143, 207, 208)
HSL
hsl(181, 41%, 69%)
HSB
hsb(181, 31%, 82%)
CMYK
cmyk(31%, 0%, 0%, 18%)
Oklch
oklch(81.2% 0.065 197.2)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8C5D64
5E8D86

Analogous

8D5E7C
8C5D64
8D6E5E

Triadic

8C5D64
658D5E
5E658D

Split-Comp.

8C5D64
5E8D6E
5E7C8D

Tetradic

8C5D64
7C8D5E
5E8D86
6E5E8D

Contrast Matrix WCAG 2.1 Contrast

8C5D64
858575
86978E
708882
8FCFD0
—
1.5
Fail
1.8
Fail
1.4
Fail
3.1
AA Large
1.5
Fail
—
1.2
Fail
1.0
Fail
2.1
Fail
1.8
Fail
1.2
Fail
—
1.2
Fail
1.8
Fail
1.4
Fail
1.0
Fail
1.2
Fail
—
2.2
Fail
3.1
AA Large
2.1
Fail
1.8
Fail
2.2
Fail
—
White BG
5.4AA
3.7AA Large
3.1AA Large
3.8AA Large
1.7Fail
Black BG
3.9AA Large
5.6AA
6.8AA
5.5AA
12.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

787762
858579
8D8E90
7A7B83
ABABD0

Deuteranopia

7A7E62
85857A
8C8B91
797784
A7A2D0

Tritanopia

8A6161
857C7D
879292
718585
92D0D0

Achromatopsia

6C6C6C
838383
919191
808080
BCBCBC

Shades & Tints Shades & Tints

#8C5D64

Dark
Light

#858575

Dark
Light

#86978E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8c5d64;
  --color-2: #858575;
  --color-3: #86978e;
  --color-4: #708882;
  --color-5: #8fcfd0;
}

SCSS

$color-1: #8c5d64;
$color-2: #858575;
$color-3: #86978e;
$color-4: #708882;
$color-5: #8fcfd0;

TAILWIND

colors: {
  'brand-1': '#8c5d64',
  'brand-2': '#858575',
  'brand-3': '#86978e',
  'brand-4': '#708882',
  'brand-5': '#8fcfd0',
}

RGB Array

[140, 93, 100], [133, 133, 117], [134, 151, 142], [112, 136, 130], [143, 207, 208]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8C5D64, #858575, #86978E, #708882, #8FCFD0 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: #8c5d64; --color-2: #858575; --color-3: #86978e; --color-4: #708882; --color-5: #8fcfd0. 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