#D0C664 + #97AE59 + #44807F + #513C5C + #854C75 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D0C664

Autumn Sage · BurlyWood · Sunflower

HEX

#D0C664

RGB

rgb(208, 198, 100)

HSL

hsl(54, 53%, 60%)

HSB

hsb(54, 52%, 82%)

CMYK

cmyk(0%, 5%, 52%, 18%)

Oklch

oklch(81.5% 0.121 103.5)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#97AE59

Grass Green · DarkSeaGreen · Olive Green

HEX

#97AE59

RGB

rgb(151, 174, 89)

HSL

hsl(76, 34%, 52%)

HSB

hsb(76, 49%, 68%)

CMYK

cmyk(13%, 0%, 49%, 32%)

Oklch

oklch(71.4% 0.114 121.8)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#44807F

Mineral Blue · SeaGreen · Mint Ice

HEX

#44807F

RGB

rgb(68, 128, 127)

HSL

hsl(179, 31%, 38%)

HSB

hsb(179, 47%, 50%)

CMYK

cmyk(47%, 0%, 1%, 50%)

Oklch

oklch(55.9% 0.063 194.1)

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

#513C5C

Dark Plum · DarkSlateGray · Eggplant

HEX

#513C5C

RGB

rgb(81, 60, 92)

HSL

hsl(279, 21%, 30%)

HSB

hsb(279, 35%, 36%)

CMYK

cmyk(12%, 35%, 0%, 64%)

Oklch

oklch(39.2% 0.059 313.6)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#854C75

Rose Purple · DimGray · Violet

HEX

#854C75

RGB

rgb(133, 76, 117)

HSL

hsl(317, 27%, 41%)

HSB

hsb(317, 43%, 52%)

CMYK

cmyk(0%, 43%, 12%, 48%)

Oklch

oklch(49.8% 0.095 338.3)

Traditional「Rose Purple」· Paint「Violet」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D0C664

636ECF

Analogous

CF8E63

D0C664

A4CF63

Triadic

D0C664

63CFC4

C463CF

Split-Comp.

D0C664

63A4CF

8E63CF

Tetradic

D0C664

63CF8E

636ECF

CF63A4

Contrast Matrix WCAG 2.1 Contrast

D0C664	97AE59	44807F	513C5C	854C75
—	1.4 Fail	2.6 Fail	5.6 AA	3.6 AA Large
1.4 Fail	—	1.8 Fail	4.0 AA Large	2.6 Fail
2.6 Fail	1.8 Fail	—	2.2 Fail	1.4 Fail
5.6 AA	4.0 AA Large	2.2 Fail	—	1.5 Fail
3.6 AA Large	2.6 Fail	1.4 Fail	1.5 Fail	—

White BG

1.8Fail

2.5Fail

4.5AA

9.8AAA

6.4AA

Black BG

11.9AAA

8.5AAA

4.6AA

2.2Fail

3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

CCCC7C

A1A16E

5E5F7F

484854

6C6C6B

Deuteranopia

CCCD81

A09E73

5B567F

494B52

707469

Tritanopia

D08E93

987E81

477F7F

504E4D

826362

Achromatopsia

BEBEBE

9D9D9D

6E6E6E

464646

626262

Shades & Tints Shades & Tints

#D0C664

Dark

Light

#97AE59

Dark

Light

#44807F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d0c664;
  --color-2: #97ae59;
  --color-3: #44807f;
  --color-4: #513c5c;
  --color-5: #854c75;
}

SCSS

$color-1: #d0c664;
$color-2: #97ae59;
$color-3: #44807f;
$color-4: #513c5c;
$color-5: #854c75;

TAILWIND

colors: {
  'brand-1': '#d0c664',
  'brand-2': '#97ae59',
  'brand-3': '#44807f',
  'brand-4': '#513c5c',
  'brand-5': '#854c75',
}

RGB Array

[208, 198, 100], [151, 174, 89], [68, 128, 127], [81, 60, 92], [133, 76, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D0C664, #97AE59, #44807F, #513C5C, #854C75 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: #d0c664; --color-2: #97ae59; --color-3: #44807f; --color-4: #513c5c; --color-5: #854c75. 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. 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