← Back to Editor

#DE5C32 · #997066 · #5A626C · #334F4F · #10241B

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

#DE5C32

Tangerine · Chocolate · Warm Sun

HEX
#DE5C32
RGB
rgb(222, 92, 50)
HSL
hsl(15, 72%, 53%)
HSB
hsb(15, 77%, 87%)
CMYK
cmyk(0%, 59%, 77%, 13%)
Oklch
oklch(63.5% 0.172 37.9)

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

#997066

Crimson · Gray · Passion Red

HEX
#997066
RGB
rgb(153, 112, 102)
HSL
hsl(12, 20%, 50%)
HSB
hsb(12, 33%, 60%)
CMYK
cmyk(0%, 27%, 33%, 40%)
Oklch
oklch(58.4% 0.055 34.1)

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

#5A626C

Indigo · DimGray · Charcoal

HEX
#5A626C
RGB
rgb(90, 98, 108)
HSL
hsl(213, 9%, 39%)
HSB
hsb(213, 17%, 42%)
CMYK
cmyk(17%, 9%, 0%, 58%)
Oklch
oklch(49.3% 0.019 254.0)

Traditional「Indigo」· Paint「Charcoal」· Creative Midnight Shadow

#334F4F

Slate Blue · DarkSlateGray · Peacock Green

HEX
#334F4F
RGB
rgb(51, 79, 79)
HSL
hsl(180, 22%, 25%)
HSB
hsb(180, 35%, 31%)
CMYK
cmyk(35%, 0%, 0%, 69%)
Oklch
oklch(40.5% 0.034 195.9)

Traditional「Slate Blue」· Paint「Peacock Green」· Creative Blush Sunrise

#10241B

Mineral Blue · Black · Dark Green

HEX
#10241B
RGB
rgb(16, 36, 27)
HSL
hsl(153, 38%, 10%)
HSB
hsb(153, 56%, 14%)
CMYK
cmyk(56%, 0%, 25%, 86%)
Oklch
oklch(24.0% 0.032 163.4)

Traditional「Mineral Blue」· Paint「Dark Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DE5C32
31B2DD

Analogous

DD315C
DE5C32
DDB231

Triadic

DE5C32
31DD5C
5C31DD

Split-Comp.

DE5C32
31DDB2
315CDD

Tetradic

DE5C32
5CDD31
31B2DD
B231DD

Contrast Matrix WCAG 2.1 Contrast

DE5C32
997066
5A626C
334F4F
10241B
—
1.2
Fail
1.7
Fail
2.4
Fail
4.4
AA Large
1.2
Fail
—
1.4
Fail
2.1
Fail
3.8
AA Large
1.7
Fail
1.4
Fail
—
1.4
Fail
2.6
Fail
2.4
Fail
2.1
Fail
1.4
Fail
—
1.8
Fail
4.4
AA Large
3.8
AA Large
2.6
Fail
1.8
Fail
—
White BG
3.7AA Large
4.3AA Large
6.2AA
8.9AAA
16.3AAA
Black BG
5.7AA
4.9AA
3.4AA Large
2.4Fail
1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A53C
878768
5D5E6A
3F3F4F
19191D

Deuteranopia

ADB73F
8A8D69
5D5C69
3E3B4F
18161E

Tritanopia

D74446
976A6B
5A6867
344F4F
111F1F

Achromatopsia

7E7E7E
7B7B7B
616161
474747
1D1D1D

Shades & Tints Shades & Tints

#DE5C32

Dark
Light

#997066

Dark
Light

#5A626C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #de5c32;
  --color-2: #997066;
  --color-3: #5a626c;
  --color-4: #334f4f;
  --color-5: #10241b;
}

SCSS

$color-1: #de5c32;
$color-2: #997066;
$color-3: #5a626c;
$color-4: #334f4f;
$color-5: #10241b;

TAILWIND

colors: {
  'brand-1': '#de5c32',
  'brand-2': '#997066',
  'brand-3': '#5a626c',
  'brand-4': '#334f4f',
  'brand-5': '#10241b',
}

RGB Array

[222, 92, 50], [153, 112, 102], [90, 98, 108], [51, 79, 79], [16, 36, 27]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #DE5C32, #997066, #5A626C, #334F4F, #10241B is ideal for: tech websites, dark mode UIs, game UIs, 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: #de5c32; --color-2: #997066; --color-3: #5a626c; --color-4: #334f4f; --color-5: #10241b. 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 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