← Back to Editor

#576062 · #0AF51A · #21A448 · #FB2C2D · #B90A5C

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 App

Color Details Color Details

#576062

Ink Gray · DimGray · Charcoal

HEX
#576062
RGB
rgb(87, 96, 98)
HSL
hsl(191, 6%, 36%)
HSB
hsb(191, 11%, 38%)
CMYK
cmyk(11%, 2%, 0%, 62%)
Oklch
oklch(48.2% 0.012 212.6)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#0AF51A

Pine Green · Lime · Olive Green

HEX
#0AF51A
RGB
rgb(10, 245, 26)
HSL
hsl(124, 92%, 50%)
HSB
hsb(124, 96%, 96%)
CMYK
cmyk(96%, 0%, 89%, 4%)
Oklch
oklch(84.1% 0.282 142.8)

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

#21A448

Pine Green · SeaGreen · Forest Green

HEX
#21A448
RGB
rgb(33, 164, 72)
HSL
hsl(138, 66%, 39%)
HSB
hsb(138, 80%, 64%)
CMYK
cmyk(80%, 0%, 56%, 36%)
Oklch
oklch(63.1% 0.171 148.1)

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

#FB2C2D

Vermilion · Crimson · Passion Red

HEX
#FB2C2D
RGB
rgb(251, 44, 45)
HSL
hsl(360, 96%, 58%)
HSB
hsb(360, 82%, 98%)
CMYK
cmyk(0%, 82%, 82%, 2%)
Oklch
oklch(63.7% 0.238 27.2)

Traditional「Vermilion」· Paint「Passion Red」· Creative Soft Aurora

#B90A5C

Dark Violet · MediumVioletRed · Camellia

HEX
#B90A5C
RGB
rgb(185, 10, 92)
HSL
hsl(332, 90%, 38%)
HSB
hsb(332, 95%, 73%)
CMYK
cmyk(0%, 95%, 50%, 27%)
Oklch
oklch(51.0% 0.201 2.5)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

576062
615856

Analogous

56615E
576062
565A61

Triadic

576062
61565F
5F6156

Split-Comp.

576062
61565A
615E56

Tetradic

576062
5E5661
615856
5A6156

Contrast Matrix WCAG 2.1 Contrast

576062
0AF51A
21A448
FB2C2D
B90A5C
—
4.3
AA Large
2.0
Fail
1.7
Fail
1.0
Fail
4.3
AA Large
—
2.2
Fail
2.6
Fail
4.3
AA Large
2.0
Fail
2.2
Fail
—
1.2
Fail
2.0
Fail
1.7
Fail
2.6
Fail
1.2
Fail
—
1.7
Fail
1.0
Fail
4.3
AA Large
2.0
Fail
1.7
Fail
—
White BG
6.5AA
1.5Fail
3.2AA Large
3.8AA Large
6.4AA
Black BG
3.3AA Large
14.1AAA
6.5AA
5.5AA
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5B62
70724F
5A5B5E
A1A02D
6D6C48

Deuteranopia

5A5A61
62515C
524864
ADBD2D
778543

Tritanopia

576161
167982
287074
F12D2D
B03835

Achromatopsia

5E5E5E
969696
727272
6A6A6A
484848

Shades & Tints Shades & Tints

#576062

Dark
Light

#0AF51A

Dark
Light

#21A448

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #576062;
  --color-2: #0af51a;
  --color-3: #21a448;
  --color-4: #fb2c2d;
  --color-5: #b90a5c;
}

SCSS

$color-1: #576062;
$color-2: #0af51a;
$color-3: #21a448;
$color-4: #fb2c2d;
$color-5: #b90a5c;

TAILWIND

colors: {
  'brand-1': '#576062',
  'brand-2': '#0af51a',
  'brand-3': '#21a448',
  'brand-4': '#fb2c2d',
  'brand-5': '#b90a5c',
}

RGB Array

[87, 96, 98], [10, 245, 26], [33, 164, 72], [251, 44, 45], [185, 10, 92]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #576062, #0AF51A, #21A448, #FB2C2D, #B90A5C 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: #576062; --color-2: #0af51a; --color-3: #21a448; --color-4: #fb2c2d; --color-5: #b90a5c. 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