← Back to Editor

#027FA1 · #128688 · #278B79 · #3B9849 · #EC3A1F

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

#027FA1

Lake Blue · Teal · Mint Ice

HEX
#027FA1
RGB
rgb(2, 127, 161)
HSL
hsl(193, 98%, 32%)
HSB
hsb(193, 99%, 63%)
CMYK
cmyk(99%, 21%, 0%, 37%)
Oklch
oklch(55.5% 0.105 225.1)

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

#128688

Lake Blue · Teal · Mint Ice

HEX
#128688
RGB
rgb(18, 134, 136)
HSL
hsl(181, 77%, 30%)
HSB
hsb(181, 87%, 53%)
CMYK
cmyk(87%, 1%, 0%, 47%)
Oklch
oklch(56.4% 0.093 196.8)

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

#278B79

Mineral Blue · SeaGreen · Mint Ice

HEX
#278B79
RGB
rgb(39, 139, 121)
HSL
hsl(169, 56%, 35%)
HSB
hsb(169, 72%, 55%)
CMYK
cmyk(72%, 0%, 13%, 45%)
Oklch
oklch(57.6% 0.094 178.0)

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

#3B9849

Celadon · SeaGreen · Olive Green

HEX
#3B9849
RGB
rgb(59, 152, 73)
HSL
hsl(129, 44%, 41%)
HSB
hsb(129, 61%, 60%)
CMYK
cmyk(61%, 0%, 52%, 40%)
Oklch
oklch(60.5% 0.145 146.3)

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

#EC3A1F

Vermilion · OrangeRed · Passion Red

HEX
#EC3A1F
RGB
rgb(236, 58, 31)
HSL
hsl(8, 84%, 52%)
HSB
hsb(8, 87%, 93%)
CMYK
cmyk(0%, 75%, 87%, 7%)
Oklch
oklch(61.9% 0.218 31.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

027FA1
A22402

Analogous

02A274
027FA1
022FA2

Triadic

027FA1
A2027F
7FA202

Split-Comp.

027FA1
A2022F
A27402

Tetradic

027FA1
7402A2
A22402
2FA202

Contrast Matrix WCAG 2.1 Contrast

027FA1
128688
278B79
3B9849
EC3A1F
—
1.1
Fail
1.1
Fail
1.3
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.1
Fail
1.1
Fail
1.1
Fail
—
1.1
Fail
1.0
Fail
1.3
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.1
Fail
1.1
Fail
1.0
Fail
1.1
Fail
—
White BG
4.6AA
4.4AA Large
4.2AA Large
3.6AA Large
4.0AA Large
Black BG
4.6AA
4.8AA
5.1AA
5.8AA
5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

383999
444588
52537D
63645C
9F9D26

Deuteranopia

312897
3E3587
4D457E
5E5761
A9B727

Tritanopia

089291
188787
2C8182
406B6F
E32B2C

Achromatopsia

5E5E5E
646464
6B6B6B
737373
6C6C6C

Shades & Tints Shades & Tints

#027FA1

Dark
Light

#128688

Dark
Light

#278B79

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #027fa1;
  --color-2: #128688;
  --color-3: #278b79;
  --color-4: #3b9849;
  --color-5: #ec3a1f;
}

SCSS

$color-1: #027fa1;
$color-2: #128688;
$color-3: #278b79;
$color-4: #3b9849;
$color-5: #ec3a1f;

TAILWIND

colors: {
  'brand-1': '#027fa1',
  'brand-2': '#128688',
  'brand-3': '#278b79',
  'brand-4': '#3b9849',
  'brand-5': '#ec3a1f',
}

RGB Array

[2, 127, 161], [18, 134, 136], [39, 139, 121], [59, 152, 73], [236, 58, 31]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #027FA1, #128688, #278B79, #3B9849, #EC3A1F is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. 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: #027fa1; --color-2: #128688; --color-3: #278b79; --color-4: #3b9849; --color-5: #ec3a1f. 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. 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