← Back to Editor

#F80E63 · #F89247 · #E3D153 · #61B34E · #119CAF

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

#F80E63

Dark Violet · Crimson · Rose Pink

HEX
#F80E63
RGB
rgb(248, 14, 99)
HSL
hsl(338, 94%, 51%)
HSB
hsb(338, 94%, 97%)
CMYK
cmyk(0%, 94%, 60%, 3%)
Oklch
oklch(62.8% 0.247 10.9)

Traditional「Dark Violet」· Paint「Rose Pink」· Creative Blush Sunrise

#F89247

Apricot · Coral · Warm Sun

HEX
#F89247
RGB
rgb(248, 146, 71)
HSL
hsl(25, 93%, 63%)
HSB
hsb(25, 71%, 97%)
CMYK
cmyk(0%, 41%, 71%, 3%)
Oklch
oklch(75.5% 0.152 54.2)

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

#E3D153

Fresh Green · SandyBrown · Sunflower

HEX
#E3D153
RGB
rgb(227, 209, 83)
HSL
hsl(53, 72%, 61%)
HSB
hsb(53, 63%, 89%)
CMYK
cmyk(0%, 8%, 63%, 11%)
Oklch
oklch(85.2% 0.145 101.2)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#61B34E

Celadon · MediumSeaGreen · Olive Green

HEX
#61B34E
RGB
rgb(97, 179, 78)
HSL
hsl(109, 40%, 50%)
HSB
hsb(109, 56%, 70%)
CMYK
cmyk(46%, 0%, 56%, 30%)
Oklch
oklch(69.2% 0.159 139.9)

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

#119CAF

Lake Blue · LightSeaGreen · Mint Ice

HEX
#119CAF
RGB
rgb(17, 156, 175)
HSL
hsl(187, 82%, 38%)
HSB
hsb(187, 90%, 69%)
CMYK
cmyk(90%, 11%, 0%, 31%)
Oklch
oklch(63.6% 0.107 210.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F80E63
0DF8A1

Analogous

F80DD8
F80E63
F82C0D

Triadic

F80E63
63F80D
0D63F8

Split-Comp.

F80E63
0DF82C
0DD8F8

Tetradic

F80E63
D8F80D
0DF8A1
2C0DF8

Contrast Matrix WCAG 2.1 Contrast

F80E63
F89247
E3D153
61B34E
119CAF
—
1.8
Fail
2.6
Fail
1.5
Fail
1.2
Fail
1.8
Fail
—
1.5
Fail
1.1
Fail
1.4
Fail
2.6
Fail
1.5
Fail
—
1.7
Fail
2.1
Fail
1.5
Fail
1.1
Fail
1.7
Fail
—
1.3
Fail
1.2
Fail
1.4
Fail
2.1
Fail
1.3
Fail
—
White BG
4.0AA Large
2.3Fail
1.6Fail
2.6Fail
3.3AA Large
Black BG
5.2AA
9.2AAA
13.5AAA
8.1AAA
6.4AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

93914E
CCCB59
DBDB71
858566
4D4EAA

Deuteranopia

A0B24A
D2D95E
DCDE79
807A6C
453BA9

Tritanopia

EC3E3B
F3676B
E28A8F
657A7E
18A7A6

Achromatopsia

5E5E5E
A8A8A8
C8C8C8
8F8F8F
757575

Shades & Tints Shades & Tints

#F80E63

Dark
Light

#F89247

Dark
Light

#E3D153

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f80e63;
  --color-2: #f89247;
  --color-3: #e3d153;
  --color-4: #61b34e;
  --color-5: #119caf;
}

SCSS

$color-1: #f80e63;
$color-2: #f89247;
$color-3: #e3d153;
$color-4: #61b34e;
$color-5: #119caf;

TAILWIND

colors: {
  'brand-1': '#f80e63',
  'brand-2': '#f89247',
  'brand-3': '#e3d153',
  'brand-4': '#61b34e',
  'brand-5': '#119caf',
}

RGB Array

[248, 14, 99], [248, 146, 71], [227, 209, 83], [97, 179, 78], [17, 156, 175]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F80E63, #F89247, #E3D153, #61B34E, #119CAF 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: #f80e63; --color-2: #f89247; --color-3: #e3d153; --color-4: #61b34e; --color-5: #119caf. 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