← Back to Editor

#C8C578 · #E2E0AF · #728F8A · #505E5F · #19242A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#C8C578

Fresh Green · Tan · Sunflower

HEX
#C8C578
RGB
rgb(200, 197, 120)
HSL
hsl(58, 42%, 63%)
HSB
hsb(58, 40%, 78%)
CMYK
cmyk(0%, 1%, 40%, 22%)
Oklch
oklch(80.9% 0.099 106.5)

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

#E2E0AF

Fresh Green · Wheat · Lemon Cream

HEX
#E2E0AF
RGB
rgb(226, 224, 175)
HSL
hsl(58, 47%, 79%)
HSB
hsb(58, 23%, 89%)
CMYK
cmyk(0%, 1%, 23%, 11%)
Oklch
oklch(89.6% 0.064 105.7)

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

#728F8A

Mineral Blue · SlateGray · Mint Ice

HEX
#728F8A
RGB
rgb(114, 143, 138)
HSL
hsl(170, 11%, 50%)
HSB
hsb(170, 20%, 56%)
CMYK
cmyk(20%, 0%, 3%, 44%)
Oklch
oklch(62.6% 0.034 183.6)

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

#505E5F

Slate Blue · DimGray · Charcoal

HEX
#505E5F
RGB
rgb(80, 94, 95)
HSL
hsl(184, 9%, 34%)
HSB
hsb(184, 16%, 37%)
CMYK
cmyk(16%, 1%, 0%, 63%)
Oklch
oklch(47.0% 0.017 201.9)

Traditional「Slate Blue」· Paint「Charcoal」· Creative Midnight Shadow

#19242A

Slate Blue · Black · Deep Sea Blue

HEX
#19242A
RGB
rgb(25, 36, 42)
HSL
hsl(201, 25%, 13%)
HSB
hsb(201, 40%, 16%)
CMYK
cmyk(40%, 14%, 0%, 84%)
Oklch
oklch(25.3% 0.019 232.3)

Traditional「Slate Blue」· Paint「Deep Sea Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C8C578
797CC8

Analogous

C89E79
C8C578
A3C879

Triadic

C8C578
79C8C6
C679C8

Split-Comp.

C8C578
79A3C8
9E79C8

Tetradic

C8C578
79C89E
797CC8
C879A3

Contrast Matrix WCAG 2.1 Contrast

C8C578
E2E0AF
728F8A
505E5F
19242A
—
1.3
Fail
1.9
Fail
3.8
AA Large
8.8
AAA
1.3
Fail
—
2.6
Fail
5.0
AA
11.7
AAA
1.9
Fail
2.6
Fail
—
1.9
Fail
4.5
AA
3.8
AA Large
5.0
AA
1.9
Fail
—
2.3
Fail
8.8
AAA
11.7
AAA
4.5
AA
2.3
Fail
—
White BG
1.8Fail
1.4Fail
3.5AA Large
6.8AA
15.8AAA
Black BG
11.7AAA
15.5AAA
6.0AA
3.1AA Large
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C78B
E1E1BB
7F7F8B
56565F
1E1E29

Deuteranopia

C7C78F
E1E1BE
7D7B8C
55545F
1D1C28

Tritanopia

C8999D
E2C4C6
738C8C
515F5F
1A2727

Achromatopsia

BDBDBD
DBDBDB
868686
5A5A5A
212121

Shades & Tints Shades & Tints

#C8C578

Dark
Light

#E2E0AF

Dark
Light

#728F8A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c8c578;
  --color-2: #e2e0af;
  --color-3: #728f8a;
  --color-4: #505e5f;
  --color-5: #19242a;
}

SCSS

$color-1: #c8c578;
$color-2: #e2e0af;
$color-3: #728f8a;
$color-4: #505e5f;
$color-5: #19242a;

TAILWIND

colors: {
  'brand-1': '#c8c578',
  'brand-2': '#e2e0af',
  'brand-3': '#728f8a',
  'brand-4': '#505e5f',
  'brand-5': '#19242a',
}

RGB Array

[200, 197, 120], [226, 224, 175], [114, 143, 138], [80, 94, 95], [25, 36, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C8C578, #E2E0AF, #728F8A, #505E5F, #19242A is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. 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: #c8c578; --color-2: #e2e0af; --color-3: #728f8a; --color-4: #505e5f; --color-5: #19242a. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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