← Back to Editor

#CCFF00 · #38FF42 · #2AB093 · #335F87 · #392863

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 App

Color Details Color Details

#CCFF00

Grass Green · Yellow · Olive Green

HEX
#CCFF00
RGB
rgb(204, 255, 0)
HSL
hsl(72, 100%, 50%)
HSB
hsb(72, 100%, 100%)
CMYK
cmyk(20%, 0%, 100%, 0%)
Oklch
oklch(93.1% 0.229 123.1)

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

#38FF42

Emerald · LimeGreen · Apple Green

HEX
#38FF42
RGB
rgb(56, 255, 66)
HSL
hsl(123, 100%, 61%)
HSB
hsb(123, 78%, 100%)
CMYK
cmyk(78%, 0%, 74%, 0%)
Oklch
oklch(87.3% 0.271 143.3)

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

#2AB093

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#2AB093
RGB
rgb(42, 176, 147)
HSL
hsl(167, 61%, 43%)
HSB
hsb(167, 76%, 69%)
CMYK
cmyk(76%, 0%, 16%, 31%)
Oklch
oklch(68.1% 0.119 174.2)

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

#335F87

Slate Blue · DarkSlateBlue · Prussian Blue

HEX
#335F87
RGB
rgb(51, 95, 135)
HSL
hsl(209, 45%, 36%)
HSB
hsb(209, 62%, 53%)
CMYK
cmyk(62%, 30%, 0%, 47%)
Oklch
oklch(47.2% 0.082 247.8)

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

#392863

Deep Indigo · MidnightBlue · Prussian Blue

HEX
#392863
RGB
rgb(57, 40, 99)
HSL
hsl(257, 42%, 27%)
HSB
hsb(257, 60%, 39%)
CMYK
cmyk(42%, 60%, 0%, 61%)
Oklch
oklch(33.0% 0.100 293.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CCFF00
3300FF

Analogous

FFB300
CCFF00
4DFF00

Triadic

CCFF00
00CCFF
FF00CC

Split-Comp.

CCFF00
004CFF
B300FF

Tetradic

CCFF00
00FFB3
3300FF
FF004C

Contrast Matrix WCAG 2.1 Contrast

CCFF00
38FF42
2AB093
335F87
392863
—
1.1
Fail
2.3
Fail
5.7
AA
10.8
AAA
1.1
Fail
—
2.0
Fail
5.0
AA
9.4
AAA
2.3
Fail
2.0
Fail
—
2.5
Fail
4.7
AA
5.7
AA
5.0
AA
2.5
Fail
—
1.9
Fail
10.8
AAA
9.4
AAA
4.7
AA
1.9
Fail
—
White BG
1.2Fail
1.4Fail
2.7Fail
6.7AA
12.7AAA
Black BG
17.9AAA
15.6AAA
7.7AAA
3.1AA Large
1.7Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

E2E33E
8E9070
64659A
46467D
323155

Deuteranopia

DFDB4D
83747B
5C529C
44407B
333451

Tritanopia

CF6E79
42949C
31A0A1
357674
384947

Achromatopsia

D3D3D3
AEAEAE
858585
565656
343434

Shades & Tints Shades & Tints

#CCFF00

Dark
Light

#38FF42

Dark
Light

#2AB093

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ccff00;
  --color-2: #38ff42;
  --color-3: #2ab093;
  --color-4: #335f87;
  --color-5: #392863;
}

SCSS

$color-1: #ccff00;
$color-2: #38ff42;
$color-3: #2ab093;
$color-4: #335f87;
$color-5: #392863;

TAILWIND

colors: {
  'brand-1': '#ccff00',
  'brand-2': '#38ff42',
  'brand-3': '#2ab093',
  'brand-4': '#335f87',
  'brand-5': '#392863',
}

RGB Array

[204, 255, 0], [56, 255, 66], [42, 176, 147], [51, 95, 135], [57, 40, 99]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CCFF00, #38FF42, #2AB093, #335F87, #392863 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: #ccff00; --color-2: #38ff42; --color-3: #2ab093; --color-4: #335f87; --color-5: #392863. 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