← Back to Editor

#8C5B54 · #BB9D85 · #8D755D · #C4A39A · #AB9685

skin

A 5-color skin palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8C5B54

Crimson · DimGray · Passion Red

HEX
#8C5B54
RGB
rgb(140, 91, 84)
HSL
hsl(8, 25%, 44%)
HSB
hsb(8, 40%, 55%)
CMYK
cmyk(0%, 35%, 40%, 45%)
Oklch
oklch(52.3% 0.066 28.4)

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

#BB9D85

Apricot · Tan · Warm Sun

HEX
#BB9D85
RGB
rgb(187, 157, 133)
HSL
hsl(27, 28%, 63%)
HSB
hsb(27, 29%, 73%)
CMYK
cmyk(0%, 16%, 29%, 27%)
Oklch
oklch(71.7% 0.049 60.6)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#8D755D

Ochre · Gray · Amber Brown

HEX
#8D755D
RGB
rgb(141, 117, 93)
HSL
hsl(30, 21%, 46%)
HSB
hsb(30, 34%, 55%)
CMYK
cmyk(0%, 17%, 34%, 45%)
Oklch
oklch(57.9% 0.046 66.7)

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

#C4A39A

Peach Pink · Tan · Coral Red

HEX
#C4A39A
RGB
rgb(196, 163, 154)
HSL
hsl(13, 26%, 69%)
HSB
hsb(13, 21%, 77%)
CMYK
cmyk(0%, 17%, 21%, 23%)
Oklch
oklch(74.2% 0.041 35.7)

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

#AB9685

Tangerine · DarkGray · Warm Sun

HEX
#AB9685
RGB
rgb(171, 150, 133)
HSL
hsl(27, 18%, 60%)
HSB
hsb(27, 22%, 67%)
CMYK
cmyk(0%, 12%, 22%, 33%)
Oklch
oklch(68.7% 0.035 61.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8C5B54
54858C

Analogous

8C5469
8C5B54
8C7854

Triadic

8C5B54
548C5C
5C548C

Split-Comp.

8C5B54
548C78
54698C

Tetradic

8C5B54
698C54
54858C
78548C

Contrast Matrix WCAG 2.1 Contrast

8C5B54
BB9D85
8D755D
C4A39A
AB9685
—
2.2
Fail
1.3
Fail
2.4
Fail
2.0
Fail
2.2
Fail
—
1.7
Fail
1.1
Fail
1.1
Fail
1.3
Fail
1.7
Fail
—
1.9
Fail
1.5
Fail
2.4
Fail
1.1
Fail
1.9
Fail
—
1.2
Fail
2.0
Fail
1.1
Fail
1.5
Fail
1.2
Fail
—
White BG
5.6AA
2.5Fail
4.3AA Large
2.3Fail
2.8Fail
Black BG
3.7AA Large
8.3AAA
4.8AA
9.1AAA
7.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

777656
AEAE8B
838263
B6B59C
A2A289

Deuteranopia

7A7D56
B0B28C
848664
B8BA9D
A3A58A

Tritanopia

8A5757
BA8F90
8C6768
C29E9E
AA8C8D

Achromatopsia

696969
A3A3A3
797979
ACACAC
9A9A9A

Shades & Tints Shades & Tints

#8C5B54

Dark
Light

#BB9D85

Dark
Light

#8D755D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8c5b54;
  --color-2: #bb9d85;
  --color-3: #8d755d;
  --color-4: #c4a39a;
  --color-5: #ab9685;
}

SCSS

$color-1: #8c5b54;
$color-2: #bb9d85;
$color-3: #8d755d;
$color-4: #c4a39a;
$color-5: #ab9685;

TAILWIND

colors: {
  'brand-1': '#8c5b54',
  'brand-2': '#bb9d85',
  'brand-3': '#8d755d',
  'brand-4': '#c4a39a',
  'brand-5': '#ab9685',
}

RGB Array

[140, 91, 84], [187, 157, 133], [141, 117, 93], [196, 163, 154], [171, 150, 133]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This skin-style palette of #8C5B54, #BB9D85, #8D755D, #C4A39A, #AB9685 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: #8c5b54; --color-2: #bb9d85; --color-3: #8d755d; --color-4: #c4a39a; --color-5: #ab9685. 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 skin-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