#767976 + #CC9897 + #DEB184 + #B9CB85 + #A9D5BB - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#767976

Ink Gray · Gray · Warm Gray

HEX

#767976

RGB

rgb(118, 121, 118)

HSL

hsl(120, 1%, 47%)

HSB

hsb(120, 2%, 47%)

CMYK

cmyk(2%, 0%, 2%, 53%)

Oklch

oklch(57.3% 0.006 145.5)

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

#CC9897

Peach Pink · Tan · Coral Red

HEX

#CC9897

RGB

rgb(204, 152, 151)

HSL

hsl(1, 34%, 70%)

HSB

hsb(1, 26%, 80%)

CMYK

cmyk(0%, 25%, 26%, 20%)

Oklch

oklch(72.9% 0.063 20.0)

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

#DEB184

Ginger · BurlyWood · Warm Sun

HEX

#DEB184

RGB

rgb(222, 177, 132)

HSL

hsl(30, 58%, 69%)

HSB

hsb(30, 41%, 87%)

CMYK

cmyk(0%, 20%, 41%, 13%)

Oklch

oklch(79.0% 0.079 66.3)

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

#B9CB85

Willow Green · Tan · Apple Green

HEX

#B9CB85

RGB

rgb(185, 203, 133)

HSL

hsl(75, 40%, 66%)

HSB

hsb(75, 34%, 80%)

CMYK

cmyk(9%, 0%, 34%, 20%)

Oklch

oklch(81.2% 0.094 120.3)

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

#A9D5BB

Celadon · Silver · Apple Green

HEX

#A9D5BB

RGB

rgb(169, 213, 187)

HSL

hsl(145, 34%, 75%)

HSB

hsb(145, 21%, 84%)

CMYK

cmyk(21%, 0%, 12%, 16%)

Oklch

oklch(83.4% 0.059 158.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

767976

797779

Analogous

787977

767976

777978

Triadic

767976

777779

797777

Split-Comp.

767976

787779

797778

Tetradic

767976

777879

797779

797877

Contrast Matrix WCAG 2.1 Contrast

767976	CC9897	DEB184	B9CB85	A9D5BB
—	1.8 Fail	2.3 Fail	2.5 Fail	2.7 Fail
1.8 Fail	—	1.3 Fail	1.4 Fail	1.5 Fail
2.3 Fail	1.3 Fail	—	1.1 Fail	1.2 Fail
2.5 Fail	1.4 Fail	1.1 Fail	—	1.1 Fail
2.7 Fail	1.5 Fail	1.2 Fail	1.1 Fail	—

White BG

4.4AA Large

2.5Fail

2.0Fail

1.8Fail

1.6Fail

Black BG

4.8AA

8.5AAA

10.7AAA

11.9AAA

12.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

777777

B5B597

CBCA8F

C1C196

BCBCC1

Deuteranopia

777777

B9BC97

CDD092

C0BE9A

BAB6C3

Tritanopia

767777

C99797

DC9799

BAA3A6

ABC6C7

Achromatopsia

787878

A7A7A7

B9B9B9

BEBEBE

C5C5C5

Shades & Tints Shades & Tints

#767976

Dark

Light

#CC9897

Dark

Light

#DEB184

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #767976;
  --color-2: #cc9897;
  --color-3: #deb184;
  --color-4: #b9cb85;
  --color-5: #a9d5bb;
}

SCSS

$color-1: #767976;
$color-2: #cc9897;
$color-3: #deb184;
$color-4: #b9cb85;
$color-5: #a9d5bb;

TAILWIND

colors: {
  'brand-1': '#767976',
  'brand-2': '#cc9897',
  'brand-3': '#deb184',
  'brand-4': '#b9cb85',
  'brand-5': '#a9d5bb',
}

RGB Array

[118, 121, 118], [204, 152, 151], [222, 177, 132], [185, 203, 133], [169, 213, 187]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #767976, #CC9897, #DEB184, #B9CB85, #A9D5BB is ideal for: health products, baby brands, fresh-style blogs. 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: #767976; --color-2: #cc9897; --color-3: #deb184; --color-4: #b9cb85; --color-5: #a9d5bb. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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. 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