← Back to Editor

#111414 · #17FF70 · #15E897 · #13D6B2 · #13C9D6

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

#111414

Slate Blue · Black · Jet Black

HEX
#111414
RGB
rgb(17, 20, 20)
HSL
hsl(180, 8%, 7%)
HSB
hsb(180, 15%, 8%)
CMYK
cmyk(15%, 0%, 0%, 92%)
Oklch
oklch(18.8% 0.005 196.8)

Traditional「Slate Blue」· Paint「Jet Black」· Creative Midnight Shadow

#17FF70

Emerald · MediumSpringGreen · Olive Green

HEX
#17FF70
RGB
rgb(23, 255, 112)
HSL
hsl(143, 100%, 55%)
HSB
hsb(143, 91%, 100%)
CMYK
cmyk(91%, 0%, 56%, 0%)
Oklch
oklch(87.4% 0.246 148.6)

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

#15E897

Mineral Blue · MediumSpringGreen · Olive Green

HEX
#15E897
RGB
rgb(21, 232, 151)
HSL
hsl(157, 83%, 50%)
HSB
hsb(157, 91%, 91%)
CMYK
cmyk(91%, 0%, 35%, 9%)
Oklch
oklch(82.2% 0.187 158.9)

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

#13D6B2

Mineral Blue · DarkTurquoise · Mint Ice

HEX
#13D6B2
RGB
rgb(19, 214, 178)
HSL
hsl(169, 84%, 46%)
HSB
hsb(169, 91%, 84%)
CMYK
cmyk(91%, 0%, 17%, 16%)
Oklch
oklch(78.3% 0.146 174.5)

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

#13C9D6

Lake Blue · DarkTurquoise · Mint Ice

HEX
#13C9D6
RGB
rgb(19, 201, 214)
HSL
hsl(184, 84%, 46%)
HSB
hsb(184, 91%, 84%)
CMYK
cmyk(91%, 6%, 0%, 16%)
Oklch
oklch(76.3% 0.128 203.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

111414
131010

Analogous

101312
111414
101213

Triadic

111414
131013
131310

Split-Comp.

111414
131012
131210

Tetradic

111414
121013
131010
121310

Contrast Matrix WCAG 2.1 Contrast

111414
17FF70
15E897
13D6B2
13C9D6
—
13.7
AAA
11.5
AAA
10.0
AAA
9.1
AAA
13.7
AAA
—
1.2
Fail
1.4
Fail
1.5
Fail
11.5
AAA
1.2
Fail
—
1.2
Fail
1.3
Fail
10.0
AAA
1.4
Fail
1.2
Fail
—
1.1
Fail
9.1
AAA
1.5
Fail
1.3
Fail
1.1
Fail
—
White BG
18.5AAA
1.3Fail
1.6Fail
1.9Fail
2.0Fail
Black BG
1.1Fail
15.6AAA
13.0AAA
11.3AAA
10.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

121214
7B7E93
7072AB
6769BB
6263D3

Deuteranopia

121214
6E5D9B
6454AF
5C4EBD
574AD2

Tritanopia

111414
23AEB4
20BABD
1DC2C3
1CD0D0

Achromatopsia

131313
A9A9A9
A0A0A0
989898
949494

Shades & Tints Shades & Tints

#111414

Dark
Light

#17FF70

Dark
Light

#15E897

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #111414;
  --color-2: #17ff70;
  --color-3: #15e897;
  --color-4: #13d6b2;
  --color-5: #13c9d6;
}

SCSS

$color-1: #111414;
$color-2: #17ff70;
$color-3: #15e897;
$color-4: #13d6b2;
$color-5: #13c9d6;

TAILWIND

colors: {
  'brand-1': '#111414',
  'brand-2': '#17ff70',
  'brand-3': '#15e897',
  'brand-4': '#13d6b2',
  'brand-5': '#13c9d6',
}

RGB Array

[17, 20, 20], [23, 255, 112], [21, 232, 151], [19, 214, 178], [19, 201, 214]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #111414, #17FF70, #15E897, #13D6B2, #13C9D6 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: #111414; --color-2: #17ff70; --color-3: #15e897; --color-4: #13d6b2; --color-5: #13c9d6. 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