← Back to Editor

#D2E866 · #E3D772 · #E0DA32 · #2B5678 · #061F4A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#D2E866

Willow Green · Khaki · Apple Green

HEX
#D2E866
RGB
rgb(210, 232, 102)
HSL
hsl(70, 74%, 65%)
HSB
hsb(70, 56%, 91%)
CMYK
cmyk(9%, 0%, 56%, 9%)
Oklch
oklch(88.9% 0.157 117.7)

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

#E3D772

Fresh Green · Khaki · Sunflower

HEX
#E3D772
RGB
rgb(227, 215, 114)
HSL
hsl(54, 67%, 67%)
HSB
hsb(54, 50%, 89%)
CMYK
cmyk(0%, 5%, 50%, 11%)
Oklch
oklch(86.8% 0.124 102.5)

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

#E0DA32

Autumn Sage · GoldenRod · Sunflower

HEX
#E0DA32
RGB
rgb(224, 218, 50)
HSL
hsl(58, 74%, 54%)
HSB
hsb(58, 78%, 88%)
CMYK
cmyk(0%, 3%, 78%, 12%)
Oklch
oklch(86.6% 0.174 107.4)

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

#2B5678

Slate Blue · DarkSlateGray · Prussian Blue

HEX
#2B5678
RGB
rgb(43, 86, 120)
HSL
hsl(206, 47%, 32%)
HSB
hsb(206, 64%, 47%)
CMYK
cmyk(64%, 28%, 0%, 53%)
Oklch
oklch(43.8% 0.074 244.5)

Traditional「Slate Blue」· Paint「Prussian Blue」· Creative Blush Sunrise

#061F4A

Indigo · MidnightBlue · Deep Sea Blue

HEX
#061F4A
RGB
rgb(6, 31, 74)
HSL
hsl(218, 85%, 16%)
HSB
hsb(218, 92%, 29%)
CMYK
cmyk(92%, 58%, 0%, 71%)
Oklch
oklch(25.1% 0.086 260.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D2E866
7A64E8

Analogous

E8BC64
D2E866
90E864

Triadic

D2E866
64D2E8
E864D2

Split-Comp.

D2E866
6490E8
BC64E8

Tetradic

D2E866
64E8BC
7A64E8
E86490

Contrast Matrix WCAG 2.1 Contrast

D2E866
E3D772
E0DA32
2B5678
061F4A
—
1.1
Fail
1.1
Fail
5.7
AA
11.9
AAA
1.1
Fail
—
1.0
Fail
5.3
AA
10.9
AAA
1.1
Fail
1.0
Fail
—
5.3
AA
10.9
AAA
5.7
AA
5.3
AA
5.3
AA
—
2.1
Fail
11.9
AAA
10.9
AAA
10.9
AAA
2.1
Fail
—
White BG
1.4Fail
1.5Fail
1.5Fail
7.8AAA
16.1AAA
Black BG
15.5AAA
14.2AAA
14.2AAA
2.7Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

DCDC85
DEDE8A
DDDD5B
3E3E70
111140

Deuteranopia

DAD98D
DFDF90
DEDE64
3B386E
0F0D3D

Tritanopia

D39EA4
E29EA2
E07B82
2D6968
073736

Achromatopsia

D3D3D3
CFCFCF
C9C9C9
4D4D4D
1C1C1C

Shades & Tints Shades & Tints

#D2E866

Dark
Light

#E3D772

Dark
Light

#E0DA32

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d2e866;
  --color-2: #e3d772;
  --color-3: #e0da32;
  --color-4: #2b5678;
  --color-5: #061f4a;
}

SCSS

$color-1: #d2e866;
$color-2: #e3d772;
$color-3: #e0da32;
$color-4: #2b5678;
$color-5: #061f4a;

TAILWIND

colors: {
  'brand-1': '#d2e866',
  'brand-2': '#e3d772',
  'brand-3': '#e0da32',
  'brand-4': '#2b5678',
  'brand-5': '#061f4a',
}

RGB Array

[210, 232, 102], [227, 215, 114], [224, 218, 50], [43, 86, 120], [6, 31, 74]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D2E866, #E3D772, #E0DA32, #2B5678, #061F4A 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: #d2e866; --color-2: #e3d772; --color-3: #e0da32; --color-4: #2b5678; --color-5: #061f4a. 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