← Back to Editor

#C6D9A8 · #87B89B · #759C96 · #637F92 · #545B6B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C6D9A8

Willow Green · Silver · Apple Green

HEX
#C6D9A8
RGB
rgb(198, 217, 168)
HSL
hsl(83, 39%, 75%)
HSB
hsb(83, 23%, 85%)
CMYK
cmyk(9%, 0%, 23%, 15%)
Oklch
oklch(85.9% 0.069 125.0)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#87B89B

Celadon · DarkSeaGreen · Apple Green

HEX
#87B89B
RGB
rgb(135, 184, 155)
HSL
hsl(144, 26%, 63%)
HSB
hsb(144, 27%, 72%)
CMYK
cmyk(27%, 0%, 16%, 28%)
Oklch
oklch(74.0% 0.067 158.3)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#759C96

Mineral Blue · LightSlateGray · Lake Green

HEX
#759C96
RGB
rgb(117, 156, 150)
HSL
hsl(171, 16%, 54%)
HSB
hsb(171, 25%, 61%)
CMYK
cmyk(25%, 0%, 4%, 39%)
Oklch
oklch(66.2% 0.044 184.5)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

#637F92

Slate Blue · SlateGray · Navy Blue

HEX
#637F92
RGB
rgb(99, 127, 146)
HSL
hsl(204, 19%, 48%)
HSB
hsb(204, 32%, 57%)
CMYK
cmyk(32%, 13%, 0%, 43%)
Oklch
oklch(58.2% 0.044 238.2)

Traditional「Slate Blue」· Paint「Navy Blue」· Creative Blush Sunrise

#545B6B

Indigo · DimGray · Prussian Blue

HEX
#545B6B
RGB
rgb(84, 91, 107)
HSL
hsl(222, 12%, 37%)
HSB
hsb(222, 21%, 42%)
CMYK
cmyk(21%, 15%, 0%, 58%)
Oklch
oklch(47.1% 0.027 266.6)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C6D9A8
B9A6D8

Analogous

D8D2A6
C6D9A8
ACD8A6

Triadic

C6D9A8
A6C5D8
D8A6C5

Split-Comp.

C6D9A8
A6ACD8
D2A6D8

Tetradic

C6D9A8
A6D8D2
B9A6D8
D8A6AC

Contrast Matrix WCAG 2.1 Contrast

C6D9A8
87B89B
759C96
637F92
545B6B
—
1.5
Fail
2.0
Fail
2.8
Fail
4.5
AA
1.5
Fail
—
1.3
Fail
1.9
Fail
3.0
AA Large
2.0
Fail
1.3
Fail
—
1.4
Fail
2.3
Fail
2.8
Fail
1.9
Fail
1.4
Fail
—
1.6
Fail
4.5
AA
3.0
AA Large
2.3
Fail
1.6
Fail
—
White BG
1.5Fail
2.2Fail
3.0AA Large
4.2AA Large
6.8AA
Black BG
13.9AAA
9.4AAA
7.0AA
5.0AA
3.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECEB4
9C9DA2
868697
6F6F8D
575767

Deuteranopia

CDCCB7
9996A4
848198
6E6B8C
575666

Tritanopia

C7BDBF
89A8A9
779999
648A89
546463

Achromatopsia

CECECE
A6A6A6
909090
797979
5B5B5B

Shades & Tints Shades & Tints

#C6D9A8

Dark
Light

#87B89B

Dark
Light

#759C96

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c6d9a8;
  --color-2: #87b89b;
  --color-3: #759c96;
  --color-4: #637f92;
  --color-5: #545b6b;
}

SCSS

$color-1: #c6d9a8;
$color-2: #87b89b;
$color-3: #759c96;
$color-4: #637f92;
$color-5: #545b6b;

TAILWIND

colors: {
  'brand-1': '#c6d9a8',
  'brand-2': '#87b89b',
  'brand-3': '#759c96',
  'brand-4': '#637f92',
  'brand-5': '#545b6b',
}

RGB Array

[198, 217, 168], [135, 184, 155], [117, 156, 150], [99, 127, 146], [84, 91, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C6D9A8, #87B89B, #759C96, #637F92, #545B6B 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: #c6d9a8; --color-2: #87b89b; --color-3: #759c96; --color-4: #637f92; --color-5: #545b6b. 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