← Back to Editor

#EDF75E · #CAD55F · #A6B360 · #839060 · #5F6E61

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#EDF75E

Fresh Green · Khaki · Sunflower

HEX
#EDF75E
RGB
rgb(237, 247, 94)
HSL
hsl(64, 91%, 67%)
HSB
hsb(64, 62%, 97%)
CMYK
cmyk(4%, 0%, 62%, 3%)
Oklch
oklch(94.1% 0.173 112.8)

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

#CAD55F

Autumn Sage · BurlyWood · Sunflower

HEX
#CAD55F
RGB
rgb(202, 213, 95)
HSL
hsl(66, 58%, 60%)
HSB
hsb(66, 55%, 84%)
CMYK
cmyk(5%, 0%, 55%, 16%)
Oklch
oklch(84.1% 0.143 113.9)

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

#A6B360

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A6B360
RGB
rgb(166, 179, 96)
HSL
hsl(69, 35%, 54%)
HSB
hsb(69, 46%, 70%)
CMYK
cmyk(7%, 0%, 46%, 30%)
Oklch
oklch(73.8% 0.109 116.5)

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

#839060

Grass Green · Gray · Olive Green

HEX
#839060
RGB
rgb(131, 144, 96)
HSL
hsl(76, 20%, 47%)
HSB
hsb(76, 33%, 56%)
CMYK
cmyk(9%, 0%, 33%, 44%)
Oklch
oklch(63.0% 0.070 120.7)

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

#5F6E61

Ink Gray · DimGray · Charcoal

HEX
#5F6E61
RGB
rgb(95, 110, 97)
HSL
hsl(128, 7%, 40%)
HSB
hsb(128, 14%, 43%)
CMYK
cmyk(14%, 0%, 12%, 57%)
Oklch
oklch(52.2% 0.027 149.0)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EDF75E
685EF7

Analogous

F7B55E
EDF75E
A1F75E

Triadic

EDF75E
5EEDF7
F75EED

Split-Comp.

EDF75E
5EA1F7
B55EF7

Tetradic

EDF75E
5EF7B5
685EF7
F75EA1

Contrast Matrix WCAG 2.1 Contrast

EDF75E
CAD55F
A6B360
839060
5F6E61
—
1.4
Fail
2.0
Fail
3.0
Fail
4.6
AA
1.4
Fail
—
1.4
Fail
2.2
Fail
3.4
AA Large
2.0
Fail
1.4
Fail
—
1.5
Fail
2.4
Fail
3.0
Fail
2.2
Fail
1.5
Fail
—
1.6
Fail
4.6
AA
3.4
AA Large
2.4
Fail
1.6
Fail
—
White BG
1.2Fail
1.6Fail
2.3Fail
3.4AA Large
5.4AA
Black BG
18.1AAA
13.2AAA
9.2AAA
6.1AA
3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

F1F183
CFCF7C
ACAC74
89896C
656664

Deuteranopia

F1F08C
CECD82
ABAA79
88876E
656465

Tritanopia

EDA0A7
CB9297
A78487
847577
606767

Achromatopsia

E3E3E3
C4C4C4
A6A6A6
878787
686868

Shades & Tints Shades & Tints

#EDF75E

Dark
Light

#CAD55F

Dark
Light

#A6B360

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #edf75e;
  --color-2: #cad55f;
  --color-3: #a6b360;
  --color-4: #839060;
  --color-5: #5f6e61;
}

SCSS

$color-1: #edf75e;
$color-2: #cad55f;
$color-3: #a6b360;
$color-4: #839060;
$color-5: #5f6e61;

TAILWIND

colors: {
  'brand-1': '#edf75e',
  'brand-2': '#cad55f',
  'brand-3': '#a6b360',
  'brand-4': '#839060',
  'brand-5': '#5f6e61',
}

RGB Array

[237, 247, 94], [202, 213, 95], [166, 179, 96], [131, 144, 96], [95, 110, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EDF75E, #CAD55F, #A6B360, #839060, #5F6E61 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: #edf75e; --color-2: #cad55f; --color-3: #a6b360; --color-4: #839060; --color-5: #5f6e61. 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