← Back to Editor

#510D56 · #A51D6F · #DB7374 · #F5DD93 · #AAD095

sunset

A 5-color sunset palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial AppData Visualization

Color Details Color Details

#510D56

Royal Purple · MidnightBlue · Dark Purple

HEX
#510D56
RGB
rgb(81, 13, 86)
HSL
hsl(296, 74%, 19%)
HSB
hsb(296, 85%, 34%)
CMYK
cmyk(6%, 85%, 0%, 66%)
Oklch
oklch(31.8% 0.132 325.0)

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

#A51D6F

Rose Purple · MediumVioletRed · Camellia

HEX
#A51D6F
RGB
rgb(165, 29, 111)
HSL
hsl(324, 70%, 38%)
HSB
hsb(324, 82%, 65%)
CMYK
cmyk(0%, 82%, 33%, 35%)
Oklch
oklch(48.9% 0.184 349.7)

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

#DB7374

Peach Pink · LightCoral · Coral Red

HEX
#DB7374
RGB
rgb(219, 115, 116)
HSL
hsl(359, 59%, 65%)
HSB
hsb(359, 47%, 86%)
CMYK
cmyk(0%, 47%, 47%, 14%)
Oklch
oklch(67.4% 0.130 20.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#F5DD93

Goose Yellow · Khaki · Lemon Cream

HEX
#F5DD93
RGB
rgb(245, 221, 147)
HSL
hsl(45, 83%, 77%)
HSB
hsb(45, 40%, 96%)
CMYK
cmyk(0%, 10%, 40%, 4%)
Oklch
oklch(90.1% 0.097 92.2)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#AAD095

Celadon · DarkSeaGreen · Apple Green

HEX
#AAD095
RGB
rgb(170, 208, 149)
HSL
hsl(99, 39%, 70%)
HSB
hsb(99, 28%, 82%)
CMYK
cmyk(18%, 0%, 28%, 18%)
Oklch
oklch(81.5% 0.090 134.7)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

510D56
11540D

Analogous

2C0D54
510D56
540D35

Triadic

510D56
54500D
0D5450

Split-Comp.

510D56
35540D
0D542C

Tetradic

510D56
542C0D
11540D
0D3554

Contrast Matrix WCAG 2.1 Contrast

510D56
A51D6F
DB7374
F5DD93
AAD095
—
1.9
Fail
4.4
AA Large
10.1
AAA
7.9
AAA
1.9
Fail
—
2.2
Fail
5.2
AA
4.0
AA Large
4.4
AA Large
2.2
Fail
—
2.3
Fail
1.8
Fail
10.1
AAA
5.2
AA
2.3
Fail
—
1.3
Fail
7.9
AAA
4.0
AA Large
1.8
Fail
1.3
Fail
—
White BG
13.6AAA
7.0AA
3.1AA Large
1.3Fail
1.7Fail
Black BG
1.5Fail
3.0AA Large
6.7AA
15.6AAA
12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

343344
6A695B
AEAD74
EBEAA5
BABBA3

Deuteranopia

383D40
727C56
B4BC74
ECEEA9
B8B5A7

Tritanopia

4E3633
9E4B48
D67474
F4B3B6
ACAFB1

Achromatopsia

2A2A2A
4F4F4F
929292
DCDCDC
BEBEBE

Shades & Tints Shades & Tints

#510D56

Dark
Light

#A51D6F

Dark
Light

#DB7374

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #510d56;
  --color-2: #a51d6f;
  --color-3: #db7374;
  --color-4: #f5dd93;
  --color-5: #aad095;
}

SCSS

$color-1: #510d56;
$color-2: #a51d6f;
$color-3: #db7374;
$color-4: #f5dd93;
$color-5: #aad095;

TAILWIND

colors: {
  'brand-1': '#510d56',
  'brand-2': '#a51d6f',
  'brand-3': '#db7374',
  'brand-4': '#f5dd93',
  'brand-5': '#aad095',
}

RGB Array

[81, 13, 86], [165, 29, 111], [219, 115, 116], [245, 221, 147], [170, 208, 149]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #510D56, #A51D6F, #DB7374, #F5DD93, #AAD095 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: #510d56; --color-2: #a51d6f; --color-3: #db7374; --color-4: #f5dd93; --color-5: #aad095. 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 sunset-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