← Back to Editor

#5ADB94 · #0BA18C · #368986 · #8A034D · #2E0331

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

#5ADB94

Emerald · MediumAquaMarine · Apple Green

HEX
#5ADB94
RGB
rgb(90, 219, 148)
HSL
hsl(147, 64%, 61%)
HSB
hsb(147, 59%, 86%)
CMYK
cmyk(59%, 0%, 32%, 14%)
Oklch
oklch(80.1% 0.153 156.2)

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

#0BA18C

Mineral Blue · Teal · Mint Ice

HEX
#0BA18C
RGB
rgb(11, 161, 140)
HSL
hsl(172, 87%, 34%)
HSB
hsb(172, 93%, 63%)
CMYK
cmyk(93%, 0%, 13%, 37%)
Oklch
oklch(63.6% 0.115 178.9)

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

#368986

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#368986
RGB
rgb(54, 137, 134)
HSL
hsl(178, 43%, 37%)
HSB
hsb(178, 61%, 54%)
CMYK
cmyk(61%, 0%, 2%, 46%)
Oklch
oklch(57.9% 0.080 191.9)

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

#8A034D

Rose Purple · Purple · Camellia

HEX
#8A034D
RGB
rgb(138, 3, 77)
HSL
hsl(327, 96%, 28%)
HSB
hsb(327, 98%, 54%)
CMYK
cmyk(0%, 98%, 44%, 46%)
Oklch
oklch(41.4% 0.167 356.7)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#2E0331

Royal Purple · Black · Dark Purple

HEX
#2E0331
RGB
rgb(46, 3, 49)
HSL
hsl(296, 88%, 10%)
HSB
hsb(296, 94%, 19%)
CMYK
cmyk(6%, 94%, 0%, 81%)
Oklch
oklch(21.8% 0.094 325.3)

Traditional「Royal Purple」· Paint「Dark Purple」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5ADB94
DB5CA2

Analogous

62DB5C
5ADB94
5CDBD5

Triadic

5ADB94
955CDB
DB955C

Split-Comp.

5ADB94
D55CDB
DB5C62

Tetradic

5ADB94
5C62DB
DB5CA2
DBD55C

Contrast Matrix WCAG 2.1 Contrast

5ADB94
0BA18C
368986
8A034D
2E0331
—
1.8
Fail
2.4
Fail
5.5
AA
10.2
AAA
1.8
Fail
—
1.3
Fail
2.9
Fail
5.5
AA
2.4
Fail
1.3
Fail
—
2.3
Fail
4.3
AA Large
5.5
AA
2.9
Fail
2.3
Fail
—
1.9
Fail
10.2
AAA
5.5
AA
4.3
AA Large
1.9
Fail
—
White BG
1.8Fail
3.2AA Large
4.1AA Large
9.5AAA
17.9AAA
Black BG
12.0AAA
6.5AA
5.1AA
2.2Fail
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9293A5
4C4D91
5A5B87
504E3B
1B1B26

Deuteranopia

8A81A9
433892
554F87
576237
1E2123

Tritanopia

60B3B6
139596
3A8787
832D2A
2C1D1B

Achromatopsia

ACACAC
727272
707070
343434
151515

Shades & Tints Shades & Tints

#5ADB94

Dark
Light

#0BA18C

Dark
Light

#368986

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5adb94;
  --color-2: #0ba18c;
  --color-3: #368986;
  --color-4: #8a034d;
  --color-5: #2e0331;
}

SCSS

$color-1: #5adb94;
$color-2: #0ba18c;
$color-3: #368986;
$color-4: #8a034d;
$color-5: #2e0331;

TAILWIND

colors: {
  'brand-1': '#5adb94',
  'brand-2': '#0ba18c',
  'brand-3': '#368986',
  'brand-4': '#8a034d',
  'brand-5': '#2e0331',
}

RGB Array

[90, 219, 148], [11, 161, 140], [54, 137, 134], [138, 3, 77], [46, 3, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5ADB94, #0BA18C, #368986, #8A034D, #2E0331 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #5adb94; --color-2: #0ba18c; --color-3: #368986; --color-4: #8a034d; --color-5: #2e0331. 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 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