← Back to Editor

#03B2A1 · #F1E0B2 · #EC8829 · #E23028 · #3A1519

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

#03B2A1

Mineral Blue · LightSeaGreen · Mint Ice

HEX
#03B2A1
RGB
rgb(3, 178, 161)
HSL
hsl(174, 97%, 35%)
HSB
hsb(174, 98%, 70%)
CMYK
cmyk(98%, 0%, 10%, 30%)
Oklch
oklch(68.6% 0.122 183.0)

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

#F1E0B2

Goose Yellow · Wheat · Lemon Cream

HEX
#F1E0B2
RGB
rgb(241, 224, 178)
HSL
hsl(44, 69%, 82%)
HSB
hsb(44, 26%, 95%)
CMYK
cmyk(0%, 7%, 26%, 5%)
Oklch
oklch(90.9% 0.063 90.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#EC8829

Tangerine · GoldenRod · Warm Sun

HEX
#EC8829
RGB
rgb(236, 136, 41)
HSL
hsl(29, 84%, 54%)
HSB
hsb(29, 83%, 93%)
CMYK
cmyk(0%, 42%, 83%, 7%)
Oklch
oklch(72.1% 0.158 58.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#E23028

Vermilion · Crimson · Passion Red

HEX
#E23028
RGB
rgb(226, 48, 40)
HSL
hsl(3, 76%, 52%)
HSB
hsb(3, 82%, 89%)
CMYK
cmyk(0%, 79%, 82%, 11%)
Oklch
oklch(59.5% 0.214 28.4)

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

#3A1519

Crimson · Black · Deep Berry

HEX
#3A1519
RGB
rgb(58, 21, 25)
HSL
hsl(354, 47%, 15%)
HSB
hsb(354, 64%, 23%)
CMYK
cmyk(0%, 64%, 57%, 77%)
Oklch
oklch(25.4% 0.059 15.6)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

03B2A1
B00314

Analogous

03B048
03B2A1
036BB0

Triadic

03B2A1
9F03B0
B09F03

Split-Comp.

03B2A1
B0036B
B04803

Tetradic

03B2A1
4803B0
B00314
6BB003

Contrast Matrix WCAG 2.1 Contrast

03B2A1
F1E0B2
EC8829
E23028
3A1519
—
2.0
Fail
1.0
Fail
1.7
Fail
6.1
AA
2.0
Fail
—
2.0
Fail
3.4
AA Large
12.3
AAA
1.0
Fail
2.0
Fail
—
1.7
Fail
6.2
AA
1.7
Fail
3.4
AA Large
1.7
Fail
—
3.6
AA Large
6.1
AA
12.3
AAA
6.2
AA
3.6
AA Large
—
White BG
2.7Fail
1.3Fail
2.6Fail
4.5AA Large
16.1AAA
Black BG
7.9AAA
16.0AAA
8.1AAA
4.7AA
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4F50A5
EAE9BD
C1C040
95932A
2A2A18

Deuteranopia

4538A6
EBECC0
C7CE46
9FAD2A
2C2F18

Tritanopia

0CA8A9
F0C6C8
E75256
D92B2C
381717

Achromatopsia

7C7C7C
E0E0E0
9B9B9B
646464
212121

Shades & Tints Shades & Tints

#03B2A1

Dark
Light

#F1E0B2

Dark
Light

#EC8829

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #03b2a1;
  --color-2: #f1e0b2;
  --color-3: #ec8829;
  --color-4: #e23028;
  --color-5: #3a1519;
}

SCSS

$color-1: #03b2a1;
$color-2: #f1e0b2;
$color-3: #ec8829;
$color-4: #e23028;
$color-5: #3a1519;

TAILWIND

colors: {
  'brand-1': '#03b2a1',
  'brand-2': '#f1e0b2',
  'brand-3': '#ec8829',
  'brand-4': '#e23028',
  'brand-5': '#3a1519',
}

RGB Array

[3, 178, 161], [241, 224, 178], [236, 136, 41], [226, 48, 40], [58, 21, 25]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #03B2A1, #F1E0B2, #EC8829, #E23028, #3A1519 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: #03b2a1; --color-2: #f1e0b2; --color-3: #ec8829; --color-4: #e23028; --color-5: #3a1519. 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