← Back to Editor

#F30576 · #EB744F · #A68846 · #036484 · #060E4A

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

#F30576

Dark Violet · DeepPink · Camellia

HEX
#F30576
RGB
rgb(243, 5, 118)
HSL
hsl(332, 96%, 49%)
HSB
hsb(332, 98%, 95%)
CMYK
cmyk(0%, 98%, 51%, 5%)
Oklch
oklch(62.2% 0.249 3.8)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#EB744F

Peach Pink · Coral · Coral Red

HEX
#EB744F
RGB
rgb(235, 116, 79)
HSL
hsl(14, 80%, 62%)
HSB
hsb(14, 66%, 92%)
CMYK
cmyk(0%, 51%, 66%, 8%)
Oklch
oklch(69.1% 0.156 37.9)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#A68846

Ochre · Sienna · Honey Gold

HEX
#A68846
RGB
rgb(166, 136, 70)
HSL
hsl(41, 41%, 46%)
HSB
hsb(41, 58%, 65%)
CMYK
cmyk(0%, 18%, 58%, 35%)
Oklch
oklch(64.1% 0.092 85.2)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#036484

Lake Blue · Teal · Mint Ice

HEX
#036484
RGB
rgb(3, 100, 132)
HSL
hsl(195, 96%, 26%)
HSB
hsb(195, 98%, 52%)
CMYK
cmyk(98%, 24%, 0%, 48%)
Oklch
oklch(47.1% 0.092 229.1)

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

#060E4A

Indigo · MidnightBlue · Deep Sea Blue

HEX
#060E4A
RGB
rgb(6, 14, 74)
HSL
hsl(233, 85%, 16%)
HSB
hsb(233, 92%, 29%)
CMYK
cmyk(92%, 81%, 0%, 71%)
Oklch
oklch(21.3% 0.109 267.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F30576
05F585

Analogous

F505ED
F30576
F50D05

Triadic

F30576
75F505
0575F5

Split-Comp.

F30576
05F50D
05EDF5

Tetradic

F30576
EDF505
05F585
0D05F5

Contrast Matrix WCAG 2.1 Contrast

F30576
EB744F
A68846
036484
060E4A
—
1.4
Fail
1.2
Fail
1.6
Fail
4.4
AA Large
1.4
Fail
—
1.1
Fail
2.3
Fail
6.1
AA
1.2
Fail
1.1
Fail
—
2.0
Fail
5.3
AA
1.6
Fail
2.3
Fail
2.0
Fail
—
2.7
Fail
4.4
AA Large
6.1
AA
5.3
AA
2.7
Fail
—
White BG
4.1AA Large
2.9Fail
3.4AA Large
6.6AA
18.0AAA
Black BG
5.1AA
7.1AAA
6.2AA
3.2AA Large
1.2Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8C8A5B
B7B658
999956
2D2E7C
090A3B

Deuteranopia

9AAC54
BEC75A
9B9D5A
27207A
090838

Tritanopia

E74540
E55F61
A56365
087675
06302E

Achromatopsia

595959
939393
898989
4B4B4B
121212

Shades & Tints Shades & Tints

#F30576

Dark
Light

#EB744F

Dark
Light

#A68846

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f30576;
  --color-2: #eb744f;
  --color-3: #a68846;
  --color-4: #036484;
  --color-5: #060e4a;
}

SCSS

$color-1: #f30576;
$color-2: #eb744f;
$color-3: #a68846;
$color-4: #036484;
$color-5: #060e4a;

TAILWIND

colors: {
  'brand-1': '#f30576',
  'brand-2': '#eb744f',
  'brand-3': '#a68846',
  'brand-4': '#036484',
  'brand-5': '#060e4a',
}

RGB Array

[243, 5, 118], [235, 116, 79], [166, 136, 70], [3, 100, 132], [6, 14, 74]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F30576, #EB744F, #A68846, #036484, #060E4A is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, 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: #f30576; --color-2: #eb744f; --color-3: #a68846; --color-4: #036484; --color-5: #060e4a. 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. 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