← Back to Editor

#01002A · #DE2956 · #FD7042 · #1DB586 · #57D08B

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

#01002A

Deep Indigo · Black · Deep Sea Blue

HEX
#01002A
RGB
rgb(1, 0, 42)
HSL
hsl(241, 100%, 8%)
HSB
hsb(241, 100%, 16%)
CMYK
cmyk(98%, 100%, 0%, 84%)
Oklch
oklch(13.1% 0.088 266.8)

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

#DE2956

Vermilion · Crimson · Passion Red

HEX
#DE2956
RGB
rgb(222, 41, 86)
HSL
hsl(345, 73%, 52%)
HSB
hsb(345, 82%, 87%)
CMYK
cmyk(0%, 82%, 61%, 13%)
Oklch
oklch(59.0% 0.213 13.7)

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

#FD7042

Apricot · Tomato · Warm Sun

HEX
#FD7042
RGB
rgb(253, 112, 66)
HSL
hsl(15, 98%, 63%)
HSB
hsb(15, 74%, 99%)
CMYK
cmyk(0%, 56%, 74%, 1%)
Oklch
oklch(70.9% 0.183 38.2)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#1DB586

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#1DB586
RGB
rgb(29, 181, 134)
HSL
hsl(161, 72%, 41%)
HSB
hsb(161, 84%, 71%)
CMYK
cmyk(84%, 0%, 26%, 29%)
Oklch
oklch(68.8% 0.138 165.5)

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

#57D08B

Emerald · MediumAquaMarine · Olive Green

HEX
#57D08B
RGB
rgb(87, 208, 139)
HSL
hsl(146, 56%, 58%)
HSB
hsb(146, 58%, 82%)
CMYK
cmyk(58%, 0%, 33%, 18%)
Oklch
oklch(77.1% 0.148 155.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

01002A
282900

Analogous

001429
01002A
150029

Triadic

01002A
290100
002901

Split-Comp.

01002A
291500
142900

Tetradic

01002A
290014
282900
002915

Contrast Matrix WCAG 2.1 Contrast

01002A
DE2956
FD7042
1DB586
57D08B
—
4.4
AA Large
7.3
AAA
7.7
AAA
10.4
AAA
4.4
AA Large
—
1.7
Fail
1.8
Fail
2.4
Fail
7.3
AAA
1.7
Fail
—
1.1
Fail
1.4
Fail
7.7
AAA
1.8
Fail
1.1
Fail
—
1.3
Fail
10.4
AAA
2.4
Fail
1.4
Fail
1.3
Fail
—
White BG
20.3AAA
4.6AA
2.8Fail
2.6Fail
1.9Fail
Black BG
1.0Fail
4.6AA
7.6AAA
8.0AAA
10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

010120
908E4B
C0BF4D
5F6091
8B8C9C

Deuteranopia

01011D
9AA849
C8D350
564B94
847BA0

Tritanopia

011816
D54341
F65658
259A9C
5DA9AC

Achromatopsia

050505
646464
959595
828282
A4A4A4

Shades & Tints Shades & Tints

#01002A

Dark
Light

#DE2956

Dark
Light

#FD7042

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #01002a;
  --color-2: #de2956;
  --color-3: #fd7042;
  --color-4: #1db586;
  --color-5: #57d08b;
}

SCSS

$color-1: #01002a;
$color-2: #de2956;
$color-3: #fd7042;
$color-4: #1db586;
$color-5: #57d08b;

TAILWIND

colors: {
  'brand-1': '#01002a',
  'brand-2': '#de2956',
  'brand-3': '#fd7042',
  'brand-4': '#1db586',
  'brand-5': '#57d08b',
}

RGB Array

[1, 0, 42], [222, 41, 86], [253, 112, 66], [29, 181, 134], [87, 208, 139]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #01002A, #DE2956, #FD7042, #1DB586, #57D08B 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: #01002a; --color-2: #de2956; --color-3: #fd7042; --color-4: #1db586; --color-5: #57d08b. 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