← Back to Editor

#6DA690 · #E6BE0B · #C7B71A · #E9EB12 · #918774

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 Library

Color Details Color Details

#6DA690

Mineral Blue · CadetBlue · Olive Green

HEX
#6DA690
RGB
rgb(109, 166, 144)
HSL
hsl(157, 24%, 54%)
HSB
hsb(157, 34%, 65%)
CMYK
cmyk(34%, 0%, 13%, 35%)
Oklch
oklch(67.9% 0.068 168.1)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#E6BE0B

Ochre · GoldenRod · Honey Gold

HEX
#E6BE0B
RGB
rgb(230, 190, 11)
HSL
hsl(49, 91%, 47%)
HSB
hsb(49, 95%, 90%)
CMYK
cmyk(0%, 17%, 95%, 10%)
Oklch
oklch(81.3% 0.165 93.4)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#C7B71A

Autumn Sage · GoldenRod · Honey Gold

HEX
#C7B71A
RGB
rgb(199, 183, 26)
HSL
hsl(54, 77%, 44%)
HSB
hsb(54, 87%, 78%)
CMYK
cmyk(0%, 8%, 87%, 22%)
Oklch
oklch(76.9% 0.157 102.9)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#E9EB12

Autumn Sage · Yellow · Honey Gold

HEX
#E9EB12
RGB
rgb(233, 235, 18)
HSL
hsl(61, 86%, 50%)
HSB
hsb(61, 92%, 92%)
CMYK
cmyk(1%, 0%, 92%, 8%)
Oklch
oklch(90.9% 0.197 110.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#918774

Ginger · Gray · Warm Sun

HEX
#918774
RGB
rgb(145, 135, 116)
HSL
hsl(39, 12%, 51%)
HSB
hsb(39, 20%, 57%)
CMYK
cmyk(0%, 7%, 20%, 43%)
Oklch
oklch(62.7% 0.030 83.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

6DA690
A66E83

Analogous

6EA674
6DA690
6E9FA6

Triadic

6DA690
906EA6
A6906E

Split-Comp.

6DA690
A66E9F
A6746E

Tetradic

6DA690
746EA6
A66E83
9FA66E

Contrast Matrix WCAG 2.1 Contrast

6DA690
E6BE0B
C7B71A
E9EB12
918774
—
1.6
Fail
1.4
Fail
2.2
Fail
1.3
Fail
1.6
Fail
—
1.1
Fail
1.4
Fail
2.0
Fail
1.4
Fail
1.1
Fail
—
1.6
Fail
1.7
Fail
2.2
Fail
1.4
Fail
1.6
Fail
—
2.8
Fail
1.3
Fail
2.0
Fail
1.7
Fail
2.8
Fail
—
White BG
2.8Fail
1.8Fail
2.1Fail
1.3Fail
3.5AA Large
Black BG
7.5AAA
11.7AAA
10.2AAA
16.4AAA
5.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

868695
D5D436
C0C040
EAEA47
8D8D79

Deuteranopia

827E97
D7DA41
C1C249
EAEA53
8D8E7A

Tritanopia

709A9A
E45960
C65E65
E97079
917C7D

Achromatopsia

929292
B6B6B6
AAAAAA
D2D2D2
888888

Shades & Tints Shades & Tints

#6DA690

Dark
Light

#E6BE0B

Dark
Light

#C7B71A

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #6da690;
  --color-2: #e6be0b;
  --color-3: #c7b71a;
  --color-4: #e9eb12;
  --color-5: #918774;
}

SCSS

$color-1: #6da690;
$color-2: #e6be0b;
$color-3: #c7b71a;
$color-4: #e9eb12;
$color-5: #918774;

TAILWIND

colors: {
  'brand-1': '#6da690',
  'brand-2': '#e6be0b',
  'brand-3': '#c7b71a',
  'brand-4': '#e9eb12',
  'brand-5': '#918774',
}

RGB Array

[109, 166, 144], [230, 190, 11], [199, 183, 26], [233, 235, 18], [145, 135, 116]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #6DA690, #E6BE0B, #C7B71A, #E9EB12, #918774 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: #6da690; --color-2: #e6be0b; --color-3: #c7b71a; --color-4: #e9eb12; --color-5: #918774. 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