← Back to Editor

#573550 · #C24B5E · #F97461 · #EDE583 · #3B5876

sunset

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#573550

Rose Purple · DarkSlateGray · Eggplant

HEX
#573550
RGB
rgb(87, 53, 80)
HSL
hsl(312, 24%, 27%)
HSB
hsb(312, 39%, 34%)
CMYK
cmyk(0%, 39%, 8%, 66%)
Oklch
oklch(38.0% 0.063 334.6)

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

#C24B5E

Crimson · Sienna · Passion Red

HEX
#C24B5E
RGB
rgb(194, 75, 94)
HSL
hsl(350, 49%, 53%)
HSB
hsb(350, 61%, 76%)
CMYK
cmyk(0%, 61%, 52%, 24%)
Oklch
oklch(57.6% 0.153 13.6)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#F97461

Peach Pink · Salmon · Coral Red

HEX
#F97461
RGB
rgb(249, 116, 97)
HSL
hsl(8, 93%, 68%)
HSB
hsb(8, 61%, 98%)
CMYK
cmyk(0%, 53%, 61%, 2%)
Oklch
oklch(71.3% 0.167 30.0)

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

#EDE583

Fresh Green · Khaki · Sunflower

HEX
#EDE583
RGB
rgb(237, 229, 131)
HSL
hsl(55, 75%, 72%)
HSB
hsb(55, 45%, 93%)
CMYK
cmyk(0%, 3%, 45%, 7%)
Oklch
oklch(90.8% 0.120 104.4)

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

#3B5876

Indigo · DarkSlateBlue · Prussian Blue

HEX
#3B5876
RGB
rgb(59, 88, 118)
HSL
hsl(211, 33%, 35%)
HSB
hsb(211, 50%, 46%)
CMYK
cmyk(50%, 25%, 0%, 54%)
Oklch
oklch(45.1% 0.060 250.1)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

573550
34553B

Analogous

4B3455
573550
55343E

Triadic

573550
4F5534
344F55

Split-Comp.

573550
3E5534
34554B

Tetradic

573550
554B34
34553B
343E55

Contrast Matrix WCAG 2.1 Contrast

573550
C24B5E
F97461
EDE583
3B5876
—
2.2
Fail
3.8
AA Large
7.9
AAA
1.4
Fail
2.2
Fail
—
1.7
Fail
3.6
AA Large
1.6
Fail
3.8
AA Large
1.7
Fail
—
2.1
Fail
2.7
Fail
7.9
AAA
3.6
AA Large
2.1
Fail
—
5.7
AA
1.4
Fail
1.6
Fail
2.7
Fail
5.7
AA
—
White BG
10.3AAA
4.7AA
2.7Fail
1.3Fail
7.4AAA
Black BG
2.0Fail
4.5AA Large
7.7AAA
16.1AAA
2.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

484849
8E8D59
BFBE66
EAE99B
48486F

Deuteranopia

4A4D48
959E58
C7D167
EAEBA0
46446D

Tritanopia

554443
BC5655
F2696A
EDADB2
3C6968

Achromatopsia

424242
717171
9A9A9A
DCDCDC
535353

Shades & Tints Shades & Tints

#573550

Dark
Light

#C24B5E

Dark
Light

#F97461

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #573550;
  --color-2: #c24b5e;
  --color-3: #f97461;
  --color-4: #ede583;
  --color-5: #3b5876;
}

SCSS

$color-1: #573550;
$color-2: #c24b5e;
$color-3: #f97461;
$color-4: #ede583;
$color-5: #3b5876;

TAILWIND

colors: {
  'brand-1': '#573550',
  'brand-2': '#c24b5e',
  'brand-3': '#f97461',
  'brand-4': '#ede583',
  'brand-5': '#3b5876',
}

RGB Array

[87, 53, 80], [194, 75, 94], [249, 116, 97], [237, 229, 131], [59, 88, 118]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #573550, #C24B5E, #F97461, #EDE583, #3B5876 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. It is a balanced and harmonious choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #573550; --color-2: #c24b5e; --color-3: #f97461; --color-4: #ede583; --color-5: #3b5876. 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 tech, SaaS, healthcare, eco industries. 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