← Back to Editor

#98BA66 · #B7C157 · #D4E90B · #E9A70B · #E9780B

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#98BA66

Grass Green · DarkSeaGreen · Olive Green

HEX
#98BA66
RGB
rgb(152, 186, 102)
HSL
hsl(84, 38%, 56%)
HSB
hsb(84, 45%, 73%)
CMYK
cmyk(18%, 0%, 45%, 27%)
Oklch
oklch(74.4% 0.117 127.1)

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

#B7C157

Autumn Sage · Tan · Sunflower

HEX
#B7C157
RGB
rgb(183, 193, 87)
HSL
hsl(66, 46%, 55%)
HSB
hsb(66, 55%, 76%)
CMYK
cmyk(5%, 0%, 55%, 24%)
Oklch
oklch(78.2% 0.131 113.9)

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

#D4E90B

Autumn Sage · Gold · Honey Gold

HEX
#D4E90B
RGB
rgb(212, 233, 11)
HSL
hsl(66, 91%, 48%)
HSB
hsb(66, 95%, 91%)
CMYK
cmyk(9%, 0%, 95%, 9%)
Oklch
oklch(88.8% 0.202 116.2)

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

#E9A70B

Ochre · Orange · Honey Gold

HEX
#E9A70B
RGB
rgb(233, 167, 11)
HSL
hsl(42, 91%, 48%)
HSB
hsb(42, 95%, 91%)
CMYK
cmyk(0%, 28%, 95%, 9%)
Oklch
oklch(77.1% 0.158 79.7)

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

#E9780B

Tangerine · Chocolate · Amber Brown

HEX
#E9780B
RGB
rgb(233, 120, 11)
HSL
hsl(29, 91%, 48%)
HSB
hsb(29, 95%, 91%)
CMYK
cmyk(0%, 48%, 95%, 9%)
Oklch
oklch(68.9% 0.170 54.0)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

98BA66
8664B9

Analogous

B9B164
98BA66
6DB964

Triadic

98BA66
6497B9
B96497

Split-Comp.

98BA66
646DB9
B164B9

Tetradic

98BA66
64B9B1
8664B9
B9646D

Contrast Matrix WCAG 2.1 Contrast

98BA66
B7C157
D4E90B
E9A70B
E9780B
—
1.1
Fail
1.6
Fail
1.0
Fail
1.3
Fail
1.1
Fail
—
1.4
Fail
1.1
Fail
1.5
Fail
1.6
Fail
1.4
Fail
—
1.5
Fail
2.2
Fail
1.0
Fail
1.1
Fail
1.5
Fail
—
1.4
Fail
1.3
Fail
1.5
Fail
2.2
Fail
1.4
Fail
—
White BG
2.2Fail
1.9Fail
1.4Fail
2.1Fail
2.9Fail
Black BG
9.6AAA
10.8AAA
15.5AAA
10.0AAA
7.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A77A
BBBB71
DDDD41
CCCC31
B8B725

Deuteranopia

A5A27F
BBBA77
DCDA4E
D0D53A
BFC72C

Tritanopia

9A8A8E
B88589
D56B74
E64F55
E33A3F

Achromatopsia

A6A6A6
B2B2B2
C9C9C9
A9A9A9
8D8D8D

Shades & Tints Shades & Tints

#98BA66

Dark
Light

#B7C157

Dark
Light

#D4E90B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #98ba66;
  --color-2: #b7c157;
  --color-3: #d4e90b;
  --color-4: #e9a70b;
  --color-5: #e9780b;
}

SCSS

$color-1: #98ba66;
$color-2: #b7c157;
$color-3: #d4e90b;
$color-4: #e9a70b;
$color-5: #e9780b;

TAILWIND

colors: {
  'brand-1': '#98ba66',
  'brand-2': '#b7c157',
  'brand-3': '#d4e90b',
  'brand-4': '#e9a70b',
  'brand-5': '#e9780b',
}

RGB Array

[152, 186, 102], [183, 193, 87], [212, 233, 11], [233, 167, 11], [233, 120, 11]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #98BA66, #B7C157, #D4E90B, #E9A70B, #E9780B is ideal for: social media posters, mobile apps, e-commerce promos. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #98ba66; --color-2: #b7c157; --color-3: #d4e90b; --color-4: #e9a70b; --color-5: #e9780b. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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