← Back to Editor

#70E3A2 · #0FB784 · #108769 · #095A49 · #F60100

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

#70E3A2

Emerald · MediumAquaMarine · Apple Green

HEX
#70E3A2
RGB
rgb(112, 227, 162)
HSL
hsl(146, 67%, 66%)
HSB
hsb(146, 51%, 89%)
CMYK
cmyk(51%, 0%, 29%, 11%)
Oklch
oklch(83.1% 0.141 156.7)

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

#0FB784

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#0FB784
RGB
rgb(15, 183, 132)
HSL
hsl(162, 85%, 39%)
HSB
hsb(162, 92%, 72%)
CMYK
cmyk(92%, 0%, 28%, 28%)
Oklch
oklch(69.1% 0.144 164.4)

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

#108769

Mineral Blue · Teal · Mint Ice

HEX
#108769
RGB
rgb(16, 135, 105)
HSL
hsl(165, 79%, 30%)
HSB
hsb(165, 88%, 53%)
CMYK
cmyk(88%, 0%, 22%, 47%)
Oklch
oklch(55.6% 0.107 169.5)

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

#095A49

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#095A49
RGB
rgb(9, 90, 73)
HSL
hsl(167, 82%, 19%)
HSB
hsb(167, 90%, 35%)
CMYK
cmyk(90%, 0%, 19%, 65%)
Oklch
oklch(41.9% 0.077 173.5)

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

#F60100

Vermilion · Red · Passion Red

HEX
#F60100
RGB
rgb(246, 1, 0)
HSL
hsl(0, 100%, 48%)
HSB
hsb(0, 100%, 96%)
CMYK
cmyk(0%, 100%, 100%, 4%)
Oklch
oklch(61.1% 0.251 29.3)

Traditional「Vermilion」· Paint「Passion Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

70E3A2
E26EB0

Analogous

76E26E
70E3A2
6EE2DB

Triadic

70E3A2
A16EE2
E2A16E

Split-Comp.

70E3A2
DB6EE2
E26E76

Tetradic

70E3A2
6E76E2
E26EB0
E2DB6E

Contrast Matrix WCAG 2.1 Contrast

70E3A2
0FB784
108769
095A49
F60100
—
1.6
Fail
2.8
Fail
5.1
AA
2.7
Fail
1.6
Fail
—
1.7
Fail
3.2
AA Large
1.7
Fail
2.8
Fail
1.7
Fail
—
1.8
Fail
1.0
Fail
5.1
AA
3.2
AA Large
1.8
Fail
—
1.9
Fail
2.7
Fail
1.7
Fail
1.0
Fail
1.9
Fail
—
White BG
1.6Fail
2.6Fail
4.5AA Large
8.2AAA
4.3AA Large
Black BG
13.2AAA
8.1AAA
4.7AA
2.6Fail
4.9AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A3B2
585990
444570
2C2D4D
8C8A00

Deuteranopia

9B93B6
4E4193
3D3472
27214E
9AAD00

Tritanopia

76BEC1
179A9C
167677
0D5051
EA0000

Achromatopsia

B9B9B9
7F7F7F
606060
404040
4A4A4A

Shades & Tints Shades & Tints

#70E3A2

Dark
Light

#0FB784

Dark
Light

#108769

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #70e3a2;
  --color-2: #0fb784;
  --color-3: #108769;
  --color-4: #095a49;
  --color-5: #f60100;
}

SCSS

$color-1: #70e3a2;
$color-2: #0fb784;
$color-3: #108769;
$color-4: #095a49;
$color-5: #f60100;

TAILWIND

colors: {
  'brand-1': '#70e3a2',
  'brand-2': '#0fb784',
  'brand-3': '#108769',
  'brand-4': '#095a49',
  'brand-5': '#f60100',
}

RGB Array

[112, 227, 162], [15, 183, 132], [16, 135, 105], [9, 90, 73], [246, 1, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #70E3A2, #0FB784, #108769, #095A49, #F60100 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: #70e3a2; --color-2: #0fb784; --color-3: #108769; --color-4: #095a49; --color-5: #f60100. 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