← Back to Editor

#D4DD5A · #88CC11 · #C9DAA2 · #4BB5A4 · #1F8000

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#D4DD5A

Fresh Green · Khaki · Sunflower

HEX
#D4DD5A
RGB
rgb(212, 221, 90)
HSL
hsl(64, 66%, 61%)
HSB
hsb(64, 59%, 87%)
CMYK
cmyk(4%, 0%, 59%, 13%)
Oklch
oklch(86.6% 0.153 112.8)

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

#88CC11

Grass Green · Chartreuse · Olive Green

HEX
#88CC11
RGB
rgb(136, 204, 17)
HSL
hsl(82, 85%, 43%)
HSB
hsb(82, 92%, 80%)
CMYK
cmyk(33%, 0%, 92%, 20%)
Oklch
oklch(77.0% 0.204 129.9)

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

#C9DAA2

Willow Green · Silver · Apple Green

HEX
#C9DAA2
RGB
rgb(201, 218, 162)
HSL
hsl(78, 43%, 75%)
HSB
hsb(78, 26%, 85%)
CMYK
cmyk(8%, 0%, 26%, 15%)
Oklch
oklch(86.2% 0.076 121.7)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#4BB5A4

Mineral Blue · CadetBlue · Mint Ice

HEX
#4BB5A4
RGB
rgb(75, 181, 164)
HSL
hsl(170, 42%, 50%)
HSB
hsb(170, 59%, 71%)
CMYK
cmyk(59%, 0%, 9%, 29%)
Oklch
oklch(70.7% 0.101 181.0)

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

#1F8000

Pine Green · Green · Forest Green

HEX
#1F8000
RGB
rgb(31, 128, 0)
HSL
hsl(105, 100%, 25%)
HSB
hsb(105, 100%, 50%)
CMYK
cmyk(76%, 0%, 100%, 50%)
Oklch
oklch(52.4% 0.171 140.6)

Traditional「Pine Green」· Paint「Forest Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D4DD5A
635ADD

Analogous

DDA45A
D4DD5A
93DD5A

Triadic

D4DD5A
5AD4DD
DD5AD4

Split-Comp.

D4DD5A
5A93DD
A45ADD

Tetradic

D4DD5A
5ADDA4
635ADD
DD5A93

Contrast Matrix WCAG 2.1 Contrast

D4DD5A
88CC11
C9DAA2
4BB5A4
1F8000
—
1.3
Fail
1.0
Fail
1.7
Fail
3.4
AA Large
1.3
Fail
—
1.3
Fail
1.3
Fail
2.6
Fail
1.0
Fail
1.3
Fail
—
1.7
Fail
3.4
AA Large
1.7
Fail
1.3
Fail
1.7
Fail
—
2.0
Fail
3.4
AA Large
2.6
Fail
3.4
AA Large
2.0
Fail
—
White BG
1.5Fail
2.0Fail
1.5Fail
2.5Fail
5.1AA
Black BG
14.3AAA
10.7AAA
14.0AAA
8.4AAA
4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

D8D87A
A5A63E
D0D1B0
797AA8
494A1F

Deuteranopia

D7D781
A29C49
CFCEB3
736BA9
433C26

Tritanopia

D49398
8B626A
CABABD
50ABAC
24373D

Achromatopsia

CBCBCB
A2A2A2
CFCFCF
939393
545454

Shades & Tints Shades & Tints

#D4DD5A

Dark
Light

#88CC11

Dark
Light

#C9DAA2

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d4dd5a;
  --color-2: #88cc11;
  --color-3: #c9daa2;
  --color-4: #4bb5a4;
  --color-5: #1f8000;
}

SCSS

$color-1: #d4dd5a;
$color-2: #88cc11;
$color-3: #c9daa2;
$color-4: #4bb5a4;
$color-5: #1f8000;

TAILWIND

colors: {
  'brand-1': '#d4dd5a',
  'brand-2': '#88cc11',
  'brand-3': '#c9daa2',
  'brand-4': '#4bb5a4',
  'brand-5': '#1f8000',
}

RGB Array

[212, 221, 90], [136, 204, 17], [201, 218, 162], [75, 181, 164], [31, 128, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D4DD5A, #88CC11, #C9DAA2, #4BB5A4, #1F8000 is ideal for: social media posters, mobile apps, e-commerce promos, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #d4dd5a; --color-2: #88cc11; --color-3: #c9daa2; --color-4: #4bb5a4; --color-5: #1f8000. 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 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