← Back to Editor

#363038 · #00DE9B · #65FC86 · #9FF587 · #E3F7A1

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

#363038

Dark Plum · DarkSlateGray · Dark Stone

HEX
#363038
RGB
rgb(54, 48, 56)
HSL
hsl(285, 8%, 20%)
HSB
hsb(285, 14%, 22%)
CMYK
cmyk(4%, 14%, 0%, 78%)
Oklch
oklch(31.9% 0.016 317.7)

Traditional「Dark Plum」· Paint「Dark Stone」· Creative Midnight Shadow

#00DE9B

Mineral Blue · MediumSpringGreen · Mint Ice

HEX
#00DE9B
RGB
rgb(0, 222, 155)
HSL
hsl(162, 100%, 44%)
HSB
hsb(162, 100%, 87%)
CMYK
cmyk(100%, 0%, 30%, 13%)
Oklch
oklch(79.6% 0.173 162.6)

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

#65FC86

Emerald · LightGreen · Apple Green

HEX
#65FC86
RGB
rgb(101, 252, 134)
HSL
hsl(133, 96%, 69%)
HSB
hsb(133, 60%, 99%)
CMYK
cmyk(60%, 0%, 47%, 1%)
Oklch
oklch(88.3% 0.205 147.9)

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

#9FF587

Emerald · LightGreen · Apple Green

HEX
#9FF587
RGB
rgb(159, 245, 135)
HSL
hsl(107, 85%, 75%)
HSB
hsb(107, 45%, 96%)
CMYK
cmyk(35%, 0%, 45%, 4%)
Oklch
oklch(89.0% 0.166 139.1)

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

#E3F7A1

Willow Green · Khaki · Apple Green

HEX
#E3F7A1
RGB
rgb(227, 247, 161)
HSL
hsl(74, 84%, 80%)
HSB
hsb(74, 35%, 97%)
CMYK
cmyk(8%, 0%, 35%, 3%)
Oklch
oklch(94.2% 0.111 119.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

363038
31372F

Analogous

312F37
363038
372F35

Triadic

363038
37352F
2F3735

Split-Comp.

363038
35372F
2F3731

Tetradic

363038
37312F
31372F
2F3537

Contrast Matrix WCAG 2.1 Contrast

363038
00DE9B
65FC86
9FF587
E3F7A1
—
7.3
AAA
9.7
AAA
9.7
AAA
11.0
AAA
7.3
AAA
—
1.3
Fail
1.3
Fail
1.5
Fail
9.7
AAA
1.3
Fail
—
1.0
Fail
1.1
Fail
9.7
AAA
1.3
Fail
1.0
Fail
—
1.1
Fail
11.0
AAA
1.5
Fail
1.1
Fail
1.1
Fail
—
White BG
12.8AAA
1.8Fail
1.3Fail
1.3Fail
1.2Fail
Black BG
1.6Fail
11.9AAA
15.8AAA
15.9AAA
18.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

333336
6062AB
A6A8A3
C4C5A2
ECECB6

Deuteranopia

343436
5343AF
9E92A9
BFB9A8
EBE9BB

Tritanopia

363534
0BB8BB
6DB9BE
A3B7BB
E4C6CA

Achromatopsia

333333
949494
C1C1C1
CFCFCF
E7E7E7

Shades & Tints Shades & Tints

#363038

Dark
Light

#00DE9B

Dark
Light

#65FC86

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #363038;
  --color-2: #00de9b;
  --color-3: #65fc86;
  --color-4: #9ff587;
  --color-5: #e3f7a1;
}

SCSS

$color-1: #363038;
$color-2: #00de9b;
$color-3: #65fc86;
$color-4: #9ff587;
$color-5: #e3f7a1;

TAILWIND

colors: {
  'brand-1': '#363038',
  'brand-2': '#00de9b',
  'brand-3': '#65fc86',
  'brand-4': '#9ff587',
  'brand-5': '#e3f7a1',
}

RGB Array

[54, 48, 56], [0, 222, 155], [101, 252, 134], [159, 245, 135], [227, 247, 161]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #363038, #00DE9B, #65FC86, #9FF587, #E3F7A1 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: #363038; --color-2: #00de9b; --color-3: #65fc86; --color-4: #9ff587; --color-5: #e3f7a1. 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