← Back to Editor

#552222 · #995544 · #BB9966 · #DDCC99 · #558877

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

#552222

Crimson · Maroon · Wine Red

HEX
#552222
RGB
rgb(85, 34, 34)
HSL
hsl(0, 43%, 23%)
HSB
hsb(0, 60%, 33%)
CMYK
cmyk(0%, 60%, 60%, 67%)
Oklch
oklch(32.6% 0.076 22.2)

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

#995544

Crimson · Sienna · Passion Red

HEX
#995544
RGB
rgb(153, 85, 68)
HSL
hsl(12, 38%, 43%)
HSB
hsb(12, 56%, 60%)
CMYK
cmyk(0%, 44%, 56%, 40%)
Oklch
oklch(52.5% 0.095 35.0)

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

#BB9966

Ginger · DarkSalmon · Warm Sun

HEX
#BB9966
RGB
rgb(187, 153, 102)
HSL
hsl(36, 38%, 57%)
HSB
hsb(36, 45%, 73%)
CMYK
cmyk(0%, 18%, 45%, 27%)
Oklch
oklch(70.2% 0.079 77.0)

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

#DDCC99

Goose Yellow · BurlyWood · Sunflower

HEX
#DDCC99
RGB
rgb(221, 204, 153)
HSL
hsl(45, 50%, 73%)
HSB
hsb(45, 31%, 87%)
CMYK
cmyk(0%, 8%, 31%, 13%)
Oklch
oklch(84.7% 0.069 91.8)

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

#558877

Mineral Blue · SlateGray · Mint Ice

HEX
#558877
RGB
rgb(85, 136, 119)
HSL
hsl(160, 23%, 43%)
HSB
hsb(160, 38%, 53%)
CMYK
cmyk(38%, 0%, 12%, 47%)
Oklch
oklch(58.5% 0.061 171.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

552222
215454

Analogous

54213B
552222
543B21

Triadic

552222
215421
212154

Split-Comp.

552222
21543B
213B54

Tetradic

552222
3B5421
215454
3B2154

Contrast Matrix WCAG 2.1 Contrast

552222
995544
BB9966
DDCC99
558877
—
2.3
Fail
4.8
AA
8.0
AAA
3.2
AA Large
2.3
Fail
—
2.1
Fail
3.5
AA Large
1.4
Fail
4.8
AA
2.1
Fail
—
1.7
Fail
1.5
Fail
8.0
AAA
3.5
AA Large
1.7
Fail
—
2.5
Fail
3.2
AA Large
1.4
Fail
1.5
Fail
2.5
Fail
—
White BG
12.8AAA
5.6AA
2.7Fail
1.6Fail
4.1AA Large
Black BG
1.6Fail
3.7AA Large
7.9AAA
13.2AAA
5.2AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3F3E22
7C7B48
ACAC72
D6D5A5
6B6C7B

Deuteranopia

424622
808549
AEB175
D7D8A8
68647C

Tritanopia

522222
964B4C
B97C7E
DCAFB1
587E7F

Achromatopsia

313131
676767
9D9D9D
CBCBCB
777777

Shades & Tints Shades & Tints

#552222

Dark
Light

#995544

Dark
Light

#BB9966

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #552222;
  --color-2: #995544;
  --color-3: #bb9966;
  --color-4: #ddcc99;
  --color-5: #558877;
}

SCSS

$color-1: #552222;
$color-2: #995544;
$color-3: #bb9966;
$color-4: #ddcc99;
$color-5: #558877;

TAILWIND

colors: {
  'brand-1': '#552222',
  'brand-2': '#995544',
  'brand-3': '#bb9966',
  'brand-4': '#ddcc99',
  'brand-5': '#558877',
}

RGB Array

[85, 34, 34], [153, 85, 68], [187, 153, 102], [221, 204, 153], [85, 136, 119]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #552222, #995544, #BB9966, #DDCC99, #558877 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: #552222; --color-2: #995544; --color-3: #bb9966; --color-4: #ddcc99; --color-5: #558877. 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