← Back to Editor

#360A63 · #2CB186 · #F29B36 · #F1C429 · #B28DD1

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

#360A63

Royal Purple · MidnightBlue · Eggplant

HEX
#360A63
RGB
rgb(54, 10, 99)
HSL
hsl(270, 82%, 21%)
HSB
hsb(270, 90%, 39%)
CMYK
cmyk(45%, 90%, 0%, 61%)
Oklch
oklch(28.5% 0.139 299.0)

Traditional「Royal Purple」· Paint「Eggplant」· Creative Blush Sunrise

#2CB186

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#2CB186
RGB
rgb(44, 177, 134)
HSL
hsl(161, 60%, 43%)
HSB
hsb(161, 75%, 69%)
CMYK
cmyk(75%, 0%, 24%, 31%)
Oklch
oklch(68.0% 0.129 166.2)

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

#F29B36

Ginger · GoldenRod · Warm Sun

HEX
#F29B36
RGB
rgb(242, 155, 54)
HSL
hsl(32, 88%, 58%)
HSB
hsb(32, 78%, 95%)
CMYK
cmyk(0%, 36%, 78%, 5%)
Oklch
oklch(76.1% 0.151 65.2)

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

#F1C429

Ginger · GoldenRod · Sunflower

HEX
#F1C429
RGB
rgb(241, 196, 41)
HSL
hsl(47, 88%, 55%)
HSB
hsb(47, 83%, 95%)
CMYK
cmyk(0%, 19%, 83%, 5%)
Oklch
oklch(83.7% 0.162 90.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#B28DD1

Lilac · DarkGray · Lilac Purple

HEX
#B28DD1
RGB
rgb(178, 141, 209)
HSL
hsl(273, 42%, 69%)
HSB
hsb(273, 33%, 82%)
CMYK
cmyk(15%, 33%, 0%, 18%)
Oklch
oklch(70.2% 0.105 308.8)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

360A63
36610A

Analogous

0A0A61
360A63
610A61

Triadic

360A63
61360A
0A6136

Split-Comp.

360A63
61610A
0A610A

Tetradic

360A63
610A0A
36610A
0A6161

Contrast Matrix WCAG 2.1 Contrast

360A63
2CB186
F29B36
F1C429
B28DD1
—
5.6
AA
6.9
AA
9.2
AAA
5.5
AA
5.6
AA
—
1.2
Fail
1.6
Fail
1.0
Fail
6.9
AA
1.2
Fail
—
1.3
Fail
1.2
Fail
9.2
AAA
1.6
Fail
1.3
Fail
—
1.7
Fail
5.5
AA
1.0
Fail
1.2
Fail
1.7
Fail
—
White BG
15.2AAA
2.7Fail
2.2Fail
1.7Fail
2.8Fail
Black BG
1.4Fail
7.7AAA
9.5AAA
12.7AAA
7.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

23234D
666790
CCCC4E
DEDD4F
A2A2C1

Deuteranopia

262948
5E5493
D1D854
E0E458
A4A7BD

Tritanopia

343C39
33999A
EE6266
EF6C73
B0B4B1

Achromatopsia

212121
848484
A9A9A9
C0C0C0
A0A0A0

Shades & Tints Shades & Tints

#360A63

Dark
Light

#2CB186

Dark
Light

#F29B36

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #360a63;
  --color-2: #2cb186;
  --color-3: #f29b36;
  --color-4: #f1c429;
  --color-5: #b28dd1;
}

SCSS

$color-1: #360a63;
$color-2: #2cb186;
$color-3: #f29b36;
$color-4: #f1c429;
$color-5: #b28dd1;

TAILWIND

colors: {
  'brand-1': '#360a63',
  'brand-2': '#2cb186',
  'brand-3': '#f29b36',
  'brand-4': '#f1c429',
  'brand-5': '#b28dd1',
}

RGB Array

[54, 10, 99], [44, 177, 134], [242, 155, 54], [241, 196, 41], [178, 141, 209]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #360A63, #2CB186, #F29B36, #F1C429, #B28DD1 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: #360a63; --color-2: #2cb186; --color-3: #f29b36; --color-4: #f1c429; --color-5: #b28dd1. 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