← Back to Editor

#5E827A · #0A564D · #F280A4 · #FFD3B8 · #FFFEB8

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

#5E827A

Mineral Blue · SlateGray · Mint Ice

HEX
#5E827A
RGB
rgb(94, 130, 122)
HSL
hsl(167, 16%, 44%)
HSB
hsb(167, 28%, 51%)
CMYK
cmyk(28%, 0%, 6%, 49%)
Oklch
oklch(57.7% 0.042 179.5)

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

#0A564D

Mineral Blue · DarkSlateGray · Peacock Green

HEX
#0A564D
RGB
rgb(10, 86, 77)
HSL
hsl(173, 79%, 19%)
HSB
hsb(173, 88%, 34%)
CMYK
cmyk(88%, 0%, 10%, 66%)
Oklch
oklch(40.8% 0.070 182.4)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#F280A4

Rouge · LightCoral · Rose Pink

HEX
#F280A4
RGB
rgb(242, 128, 164)
HSL
hsl(341, 81%, 73%)
HSB
hsb(341, 47%, 95%)
CMYK
cmyk(0%, 47%, 32%, 5%)
Oklch
oklch(73.6% 0.144 1.1)

Traditional「Rouge」· Paint「Rose Pink」· Creative Rose Petal

#FFD3B8

Apricot · Wheat · Peach Orange

HEX
#FFD3B8
RGB
rgb(255, 211, 184)
HSL
hsl(23, 100%, 86%)
HSB
hsb(23, 28%, 100%)
CMYK
cmyk(0%, 17%, 28%, 0%)
Oklch
oklch(89.8% 0.061 53.2)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#FFFEB8

Fresh Green · Bisque · Lemon Cream

HEX
#FFFEB8
RGB
rgb(255, 254, 184)
HSL
hsl(59, 100%, 86%)
HSB
hsb(59, 28%, 100%)
CMYK
cmyk(0%, 0%, 28%, 0%)
Oklch
oklch(98.2% 0.088 107.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5E827A
825E66

Analogous

5E8268
5E827A
5E7882

Triadic

5E827A
7A5E82
827A5E

Split-Comp.

5E827A
825E78
82685E

Tetradic

5E827A
685E82
825E66
78825E

Contrast Matrix WCAG 2.1 Contrast

5E827A
0A564D
F280A4
FFD3B8
FFFEB8
—
2.0
Fail
1.7
Fail
3.1
AA Large
4.1
AA Large
2.0
Fail
—
3.4
AA Large
6.2
AA
8.2
AAA
1.7
Fail
3.4
AA Large
—
1.8
Fail
2.4
Fail
3.1
AA Large
6.2
AA
1.8
Fail
—
1.3
Fail
4.1
AA Large
8.2
AAA
2.4
Fail
1.3
Fail
—
White BG
4.2AA Large
8.6AAA
2.5Fail
1.4Fail
1.0Fail
Black BG
5.0AA
2.5Fail
8.4AAA
15.3AAA
20.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6E6E7C
2B2C4F
C1C09B
ECECBF
FFFFC9

Deuteranopia

6C697C
272150
C7D099
EFF2C0
FFFFCD

Tritanopia

607D7E
0E5151
EC9493
FDC4C5
FFD6D9

Achromatopsia

767676
3E3E3E
A6A6A6
DDDDDD
F6F6F6

Shades & Tints Shades & Tints

#5E827A

Dark
Light

#0A564D

Dark
Light

#F280A4

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5e827a;
  --color-2: #0a564d;
  --color-3: #f280a4;
  --color-4: #ffd3b8;
  --color-5: #fffeb8;
}

SCSS

$color-1: #5e827a;
$color-2: #0a564d;
$color-3: #f280a4;
$color-4: #ffd3b8;
$color-5: #fffeb8;

TAILWIND

colors: {
  'brand-1': '#5e827a',
  'brand-2': '#0a564d',
  'brand-3': '#f280a4',
  'brand-4': '#ffd3b8',
  'brand-5': '#fffeb8',
}

RGB Array

[94, 130, 122], [10, 86, 77], [242, 128, 164], [255, 211, 184], [255, 254, 184]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5E827A, #0A564D, #F280A4, #FFD3B8, #FFFEB8 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: #5e827a; --color-2: #0a564d; --color-3: #f280a4; --color-4: #ffd3b8; --color-5: #fffeb8. 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