← Back to Editor

#329E88 · #360524 · #572A36 · #DDAA28 · #E8E12C

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

#329E88

Mineral Blue · MediumSeaGreen · Mint Ice

HEX
#329E88
RGB
rgb(50, 158, 136)
HSL
hsl(168, 52%, 41%)
HSB
hsb(168, 68%, 62%)
CMYK
cmyk(68%, 0%, 14%, 38%)
Oklch
oklch(63.3% 0.102 176.4)

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

#360524

Rose Purple · Black · Raspberry

HEX
#360524
RGB
rgb(54, 5, 36)
HSL
hsl(322, 83%, 12%)
HSB
hsb(322, 91%, 21%)
CMYK
cmyk(0%, 91%, 33%, 79%)
Oklch
oklch(22.8% 0.085 346.9)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#572A36

Dark Violet · DarkSlateGray · Raspberry

HEX
#572A36
RGB
rgb(87, 42, 54)
HSL
hsl(344, 35%, 25%)
HSB
hsb(344, 52%, 34%)
CMYK
cmyk(0%, 52%, 38%, 66%)
Oklch
oklch(34.9% 0.068 4.2)

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

#DDAA28

Ginger · GoldenRod · Sunflower

HEX
#DDAA28
RGB
rgb(221, 170, 40)
HSL
hsl(43, 73%, 51%)
HSB
hsb(43, 82%, 87%)
CMYK
cmyk(0%, 23%, 82%, 13%)
Oklch
oklch(76.5% 0.146 85.0)

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

#E8E12C

Autumn Sage · Gold · Sunflower

HEX
#E8E12C
RGB
rgb(232, 225, 44)
HSL
hsl(58, 80%, 54%)
HSB
hsb(58, 81%, 91%)
CMYK
cmyk(0%, 3%, 81%, 9%)
Oklch
oklch(88.7% 0.181 107.2)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

329E88
9F3248

Analogous

329F53
329E88
327E9F

Triadic

329E88
89329F
9F8932

Split-Comp.

329E88
9F327E
9F5332

Tetradic

329E88
53329F
9F3248
7E9F32

Contrast Matrix WCAG 2.1 Contrast

329E88
360524
572A36
DDAA28
E8E12C
—
5.3
AA
3.6
AA Large
1.5
Fail
2.4
Fail
5.3
AA
—
1.5
Fail
8.2
AAA
12.7
AAA
3.6
AA Large
1.5
Fail
—
5.5
AA
8.5
AAA
1.5
Fail
8.2
AAA
5.5
AA
—
1.5
Fail
2.4
Fail
12.7
AAA
8.5
AAA
1.5
Fail
—
White BG
3.3AA Large
17.4AAA
11.7AAA
2.1Fail
1.4Fail
Black BG
6.4AA
1.2Fail
1.8Fail
9.9AAA
15.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

61628D
21201C
444333
C7C647
E5E558

Deuteranopia

5B528F
24271B
464A32
CACE4F
E5E662

Tritanopia

379292
341715
553130
DA6066
E87A82

Achromatopsia

7B7B7B
171717
393939
AAAAAA
CECECE

Shades & Tints Shades & Tints

#329E88

Dark
Light

#360524

Dark
Light

#572A36

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #329e88;
  --color-2: #360524;
  --color-3: #572a36;
  --color-4: #ddaa28;
  --color-5: #e8e12c;
}

SCSS

$color-1: #329e88;
$color-2: #360524;
$color-3: #572a36;
$color-4: #ddaa28;
$color-5: #e8e12c;

TAILWIND

colors: {
  'brand-1': '#329e88',
  'brand-2': '#360524',
  'brand-3': '#572a36',
  'brand-4': '#ddaa28',
  'brand-5': '#e8e12c',
}

RGB Array

[50, 158, 136], [54, 5, 36], [87, 42, 54], [221, 170, 40], [232, 225, 44]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #329E88, #360524, #572A36, #DDAA28, #E8E12C 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: #329e88; --color-2: #360524; --color-3: #572a36; --color-4: #ddaa28; --color-5: #e8e12c. 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