#858976 + #AACCAA + #AD9573 + #FFFB94 + #DEF482 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#858976

Ink Gray · Gray · Warm Gray

HEX

#858976

RGB

rgb(133, 137, 118)

HSL

hsl(73, 7%, 50%)

HSB

hsb(73, 14%, 54%)

CMYK

cmyk(3%, 0%, 14%, 46%)

Oklch

oklch(62.1% 0.028 116.9)

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

#AACCAA

Celadon · Silver · Apple Green

HEX

#AACCAA

RGB

rgb(170, 204, 170)

HSL

hsl(120, 25%, 73%)

HSB

hsb(120, 17%, 80%)

CMYK

cmyk(17%, 0%, 17%, 20%)

Oklch

oklch(81.1% 0.060 145.0)

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

#AD9573

Ginger · Gray · Warm Sun

HEX

#AD9573

RGB

rgb(173, 149, 115)

HSL

hsl(35, 26%, 56%)

HSB

hsb(35, 34%, 68%)

CMYK

cmyk(0%, 14%, 34%, 32%)

Oklch

oklch(68.3% 0.055 76.2)

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

#FFFB94

Fresh Green · Khaki · Lemon Cream

HEX

#FFFB94

RGB

rgb(255, 251, 148)

HSL

hsl(58, 100%, 79%)

HSB

hsb(58, 42%, 100%)

CMYK

cmyk(0%, 2%, 42%, 0%)

Oklch

oklch(97.0% 0.125 106.6)

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

#DEF482

Willow Green · Khaki · Apple Green

HEX

#DEF482

RGB

rgb(222, 244, 130)

HSL

hsl(72, 84%, 73%)

HSB

hsb(72, 47%, 96%)

CMYK

cmyk(9%, 0%, 47%, 4%)

Oklch

oklch(92.7% 0.142 118.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

858976

7A7788

Analogous

888377

858976

7C8877

Triadic

858976

778588

887785

Split-Comp.

858976

777C88

837788

Tetradic

858976

778883

7A7788

88777C

Contrast Matrix WCAG 2.1 Contrast

858976	AACCAA	AD9573	FFFB94	DEF482
—	2.0 Fail	1.3 Fail	3.3 AA Large	3.0 Fail
2.0 Fail	—	1.6 Fail	1.6 Fail	1.5 Fail
1.3 Fail	1.6 Fail	—	2.7 Fail	2.4 Fail
3.3 AA Large	1.6 Fail	2.7 Fail	—	1.1 Fail
3.0 Fail	1.5 Fail	2.4 Fail	1.1 Fail	—

White BG

3.6AA Large

1.8Fail

2.9Fail

1.1Fail

1.2Fail

Black BG

5.8AA

11.9AAA

7.3AAA

19.5AAA

17.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

87877B

B9B9B2

A3A27B

FDFDAD

E8E89E

Deuteranopia

87867C

B7B4B4

A4A67D

FEFEB3

E6E5A4

Tritanopia

857E7F

ACB9BA

AC8283

FFC1C5

DFB3B8

Achromatopsia

868686

BEBEBE

989898

F0F0F0

E0E0E0

Shades & Tints Shades & Tints

#858976

Dark

Light

#AACCAA

Dark

Light

#AD9573

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #858976;
  --color-2: #aaccaa;
  --color-3: #ad9573;
  --color-4: #fffb94;
  --color-5: #def482;
}

SCSS

$color-1: #858976;
$color-2: #aaccaa;
$color-3: #ad9573;
$color-4: #fffb94;
$color-5: #def482;

TAILWIND

colors: {
  'brand-1': '#858976',
  'brand-2': '#aaccaa',
  'brand-3': '#ad9573',
  'brand-4': '#fffb94',
  'brand-5': '#def482',
}

RGB Array

[133, 137, 118], [170, 204, 170], [173, 149, 115], [255, 251, 148], [222, 244, 130]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #858976, #AACCAA, #AD9573, #FFFB94, #DEF482 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: #858976; --color-2: #aaccaa; --color-3: #ad9573; --color-4: #fffb94; --color-5: #def482. 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