#C7C686 + #9EBB8D + #73B599 + #60AA8F + #549C8E · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C7C686

Fresh Green · Tan · Sunflower

HEX

#C7C686

RGB

rgb(199, 198, 134)

HSL

hsl(59, 37%, 65%)

HSB

hsb(59, 33%, 78%)

CMYK

cmyk(0%, 1%, 33%, 22%)

Oklch

oklch(81.2% 0.084 107.4)

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

#9EBB8D

Celadon · DarkSeaGreen · Apple Green

HEX

#9EBB8D

RGB

rgb(158, 187, 141)

HSL

hsl(98, 25%, 64%)

HSB

hsb(98, 25%, 73%)

CMYK

cmyk(16%, 0%, 25%, 27%)

Oklch

oklch(75.8% 0.071 134.1)

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

#73B599

Mineral Blue · DarkSeaGreen · Olive Green

HEX

#73B599

RGB

rgb(115, 181, 153)

HSL

hsl(155, 31%, 58%)

HSB

hsb(155, 36%, 71%)

CMYK

cmyk(36%, 0%, 15%, 29%)

Oklch

oklch(72.1% 0.079 165.6)

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

#60AA8F

Mineral Blue · CadetBlue · Olive Green

HEX

#60AA8F

RGB

rgb(96, 170, 143)

HSL

hsl(158, 30%, 52%)

HSB

hsb(158, 44%, 67%)

CMYK

cmyk(44%, 0%, 16%, 33%)

Oklch

oklch(68.2% 0.085 168.2)

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

#549C8E

Mineral Blue · CadetBlue · Mint Ice

HEX

#549C8E

RGB

rgb(84, 156, 142)

HSL

hsl(168, 30%, 47%)

HSB

hsb(168, 46%, 61%)

CMYK

cmyk(46%, 0%, 9%, 39%)

Oklch

oklch(64.2% 0.076 179.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C7C686

8586C7

Analogous

C7A585

C7C686

A7C785

Triadic

C7C686

85C7C6

C685C7

Split-Comp.

C7C686

85A7C7

A585C7

Tetradic

C7C686

85C7A5

8586C7

C785A7

Contrast Matrix WCAG 2.1 Contrast

C7C686	9EBB8D	73B599	60AA8F	549C8E
—	1.2 Fail	1.3 Fail	1.6 Fail	1.8 Fail
1.2 Fail	—	1.1 Fail	1.3 Fail	1.5 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.3 Fail
1.6 Fail	1.3 Fail	1.2 Fail	—	1.2 Fail
1.8 Fail	1.5 Fail	1.3 Fail	1.2 Fail	—

White BG

1.8Fail

2.1Fail

2.4Fail

2.7Fail

3.2AA Large

Black BG

11.9AAA

9.9AAA

8.8AAA

7.6AAA

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C795

ABAB98

9090A0

808196

737491

Deuteranopia

C7C799

A9A79B

8C87A1

7C7697

6F6A92

Tritanopia

C7A2A4

9FA1A3

76A5A6

649B9C

589495

Achromatopsia

BFBFBF

ADADAD

9E9E9E

919191

858585

Shades & Tints Shades & Tints

#C7C686

Dark

Light

#9EBB8D

Dark

Light

#73B599

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c7c686;
  --color-2: #9ebb8d;
  --color-3: #73b599;
  --color-4: #60aa8f;
  --color-5: #549c8e;
}

SCSS

$color-1: #c7c686;
$color-2: #9ebb8d;
$color-3: #73b599;
$color-4: #60aa8f;
$color-5: #549c8e;

TAILWIND

colors: {
  'brand-1': '#c7c686',
  'brand-2': '#9ebb8d',
  'brand-3': '#73b599',
  'brand-4': '#60aa8f',
  'brand-5': '#549c8e',
}

RGB Array

[199, 198, 134], [158, 187, 141], [115, 181, 153], [96, 170, 143], [84, 156, 142]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #C7C686, #9EBB8D, #73B599, #60AA8F, #549C8E is ideal for: corporate websites, product showcases, portfolios. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c7c686; --color-2: #9ebb8d; --color-3: #73b599; --color-4: #60aa8f; --color-5: #549c8e. 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 cool-style 5-color scheme is especially suited for tech, SaaS, healthcare, eco industries. 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