← Back to Editor

#10E399 · #5AE310 · #55843F · #010508 · #202224

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#10E399

Mineral Blue · MediumSpringGreen · Olive Green

HEX
#10E399
RGB
rgb(16, 227, 153)
HSL
hsl(159, 87%, 48%)
HSB
hsb(159, 93%, 89%)
CMYK
cmyk(93%, 0%, 33%, 11%)
Oklch
oklch(80.9% 0.179 160.6)

Traditional「Mineral Blue」· Paint「Olive Green」· Creative Blush Sunrise

#5AE310

Pine Green · Chartreuse · Olive Green

HEX
#5AE310
RGB
rgb(90, 227, 16)
HSL
hsl(99, 87%, 48%)
HSB
hsb(99, 93%, 89%)
CMYK
cmyk(60%, 0%, 93%, 11%)
Oklch
oklch(80.8% 0.250 138.7)

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

#55843F

Celadon · DarkOliveGreen · Forest Green

HEX
#55843F
RGB
rgb(85, 132, 63)
HSL
hsl(101, 35%, 38%)
HSB
hsb(101, 52%, 52%)
CMYK
cmyk(36%, 0%, 52%, 48%)
Oklch
oklch(56.3% 0.112 136.6)

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

#010508

Lake Blue · Black · Deep Sea Blue

HEX
#010508
RGB
rgb(1, 5, 8)
HSL
hsl(206, 78%, 2%)
HSB
hsb(206, 88%, 3%)
CMYK
cmyk(88%, 37%, 0%, 97%)
Oklch
oklch(10.9% 0.016 229.8)

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

#202224

Ink Black · Black · Dark Stone

HEX
#202224
RGB
rgb(32, 34, 36)
HSL
hsl(210, 6%, 13%)
HSB
hsb(210, 11%, 14%)
CMYK
cmyk(11%, 6%, 0%, 86%)
Oklch
oklch(25.1% 0.005 248.0)

Traditional「Ink Black」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

10E399
E5105A

Analogous

10E530
10E399
10C5E5

Triadic

10E399
9A10E5
E59A10

Split-Comp.

10E399
E510C5
E53010

Tetradic

10E399
3010E5
E5105A
C5E510

Contrast Matrix WCAG 2.1 Contrast

10E399
5AE310
55843F
010508
202224
—
1.0
Fail
2.6
Fail
12.1
AAA
9.5
AAA
1.0
Fail
—
2.6
Fail
12.1
AAA
9.4
AAA
2.6
Fail
2.6
Fail
—
4.6
AA
3.6
AA Large
12.1
AAA
12.1
AAA
4.6
AA
—
1.3
Fail
9.5
AAA
9.4
AAA
3.6
AA Large
1.3
Fail
—
White BG
1.7Fail
1.7Fail
4.4AA Large
20.5AAA
16.0AAA
Black BG
12.5AAA
12.4AAA
4.8AA
1.0Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

6B6DAB
959743
696A50
030307
212124

Deuteranopia

5F4FAF
8D834F
676354
030207
212123

Tritanopia

1BB9BC
616B74
575D60
010707
202323

Achromatopsia

9B9B9B
A2A2A2
6E6E6E
040404
222222

Shades & Tints Shades & Tints

#10E399

Dark
Light

#5AE310

Dark
Light

#55843F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #10e399;
  --color-2: #5ae310;
  --color-3: #55843f;
  --color-4: #010508;
  --color-5: #202224;
}

SCSS

$color-1: #10e399;
$color-2: #5ae310;
$color-3: #55843f;
$color-4: #010508;
$color-5: #202224;

TAILWIND

colors: {
  'brand-1': '#10e399',
  'brand-2': '#5ae310',
  'brand-3': '#55843f',
  'brand-4': '#010508',
  'brand-5': '#202224',
}

RGB Array

[16, 227, 153], [90, 227, 16], [85, 132, 63], [1, 5, 8], [32, 34, 36]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #10E399, #5AE310, #55843F, #010508, #202224 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #10e399; --color-2: #5ae310; --color-3: #55843f; --color-4: #010508; --color-5: #202224. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 tech, SaaS, healthcare, eco industries. 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