← Back to Editor

#9DC5B9 · #B2B3A3 · #CD9683 · #C47162 · #8F5662

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

#9DC5B9

Jade · DarkGray · Lake Green

HEX
#9DC5B9
RGB
rgb(157, 197, 185)
HSL
hsl(162, 26%, 69%)
HSB
hsb(162, 20%, 77%)
CMYK
cmyk(20%, 0%, 6%, 23%)
Oklch
oklch(79.1% 0.046 174.8)

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

#B2B3A3

Fresh Green · DarkGray · Sunflower

HEX
#B2B3A3
RGB
rgb(178, 179, 163)
HSL
hsl(64, 10%, 67%)
HSB
hsb(64, 9%, 70%)
CMYK
cmyk(1%, 0%, 9%, 30%)
Oklch
oklch(76.1% 0.022 109.8)

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

#CD9683

Apricot · DarkSalmon · Warm Sun

HEX
#CD9683
RGB
rgb(205, 150, 131)
HSL
hsl(15, 43%, 66%)
HSB
hsb(15, 36%, 80%)
CMYK
cmyk(0%, 27%, 36%, 20%)
Oklch
oklch(72.1% 0.072 39.9)

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

#C47162

Crimson · LightCoral · Passion Red

HEX
#C47162
RGB
rgb(196, 113, 98)
HSL
hsl(9, 45%, 58%)
HSB
hsb(9, 50%, 77%)
CMYK
cmyk(0%, 42%, 50%, 23%)
Oklch
oklch(63.7% 0.108 31.2)

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

#8F5662

Crimson · DimGray · Passion Red

HEX
#8F5662
RGB
rgb(143, 86, 98)
HSL
hsl(347, 25%, 45%)
HSB
hsb(347, 40%, 56%)
CMYK
cmyk(0%, 40%, 31%, 44%)
Oklch
oklch(52.1% 0.077 6.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

9DC5B9
C59BA8

Analogous

9BC5A4
9DC5B9
9BBCC5

Triadic

9DC5B9
B89BC5
C5B89B

Split-Comp.

9DC5B9
C59BBC
C5A49B

Tetradic

9DC5B9
A49BC5
C59BA8
BCC59B

Contrast Matrix WCAG 2.1 Contrast

9DC5B9
B2B3A3
CD9683
C47162
8F5662
—
1.1
Fail
1.3
Fail
1.9
Fail
3.0
AA Large
1.1
Fail
—
1.2
Fail
1.7
Fail
2.7
Fail
1.3
Fail
1.2
Fail
—
1.4
Fail
2.3
Fail
1.9
Fail
1.7
Fail
1.4
Fail
—
1.6
Fail
3.0
AA Large
2.7
Fail
2.3
Fail
1.6
Fail
—
White BG
1.9Fail
2.1Fail
2.5Fail
3.6AA Large
5.7AA
Black BG
11.1AAA
9.9AAA
8.3AAA
5.9AA
3.7AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

AEAFBC
B2B2A7
B5B588
A09F66
76765F

Deuteranopia

ACA9BD
B2B2A8
B8BD89
A5AB67
7A7E5E

Tritanopia

9FBEBF
B2AAAB
CA8B8C
C06869
8C5D5C

Achromatopsia

B8B8B8
B1B1B1
A4A4A4
888888
686868

Shades & Tints Shades & Tints

#9DC5B9

Dark
Light

#B2B3A3

Dark
Light

#CD9683

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #9dc5b9;
  --color-2: #b2b3a3;
  --color-3: #cd9683;
  --color-4: #c47162;
  --color-5: #8f5662;
}

SCSS

$color-1: #9dc5b9;
$color-2: #b2b3a3;
$color-3: #cd9683;
$color-4: #c47162;
$color-5: #8f5662;

TAILWIND

colors: {
  'brand-1': '#9dc5b9',
  'brand-2': '#b2b3a3',
  'brand-3': '#cd9683',
  'brand-4': '#c47162',
  'brand-5': '#8f5662',
}

RGB Array

[157, 197, 185], [178, 179, 163], [205, 150, 131], [196, 113, 98], [143, 86, 98]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #9DC5B9, #B2B3A3, #CD9683, #C47162, #8F5662 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: #9dc5b9; --color-2: #b2b3a3; --color-3: #cd9683; --color-4: #c47162; --color-5: #8f5662. 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