← Back to Editor

#5B5C6E · #6F6B87 · #996E88 · #C98679 · #DEA785

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 Library

Color Details Color Details

#5B5C6E

Indigo · DimGray · Charcoal

HEX
#5B5C6E
RGB
rgb(91, 92, 110)
HSL
hsl(237, 9%, 39%)
HSB
hsb(237, 17%, 43%)
CMYK
cmyk(17%, 16%, 0%, 57%)
Oklch
oklch(48.1% 0.029 282.7)

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

#6F6B87

Deep Indigo · SlateGray · Navy Blue

HEX
#6F6B87
RGB
rgb(111, 107, 135)
HSL
hsl(249, 12%, 47%)
HSB
hsb(249, 21%, 53%)
CMYK
cmyk(18%, 21%, 0%, 47%)
Oklch
oklch(54.2% 0.043 291.4)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#996E88

Rose Purple · Gray · Rose Pink

HEX
#996E88
RGB
rgb(153, 110, 136)
HSL
hsl(324, 17%, 52%)
HSB
hsb(324, 28%, 60%)
CMYK
cmyk(0%, 28%, 11%, 40%)
Oklch
oklch(59.0% 0.065 342.4)

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

#C98679

Peach Pink · DarkSalmon · Coral Red

HEX
#C98679
RGB
rgb(201, 134, 121)
HSL
hsl(10, 43%, 63%)
HSB
hsb(10, 40%, 79%)
CMYK
cmyk(0%, 33%, 40%, 21%)
Oklch
oklch(68.5% 0.085 31.4)

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

#DEA785

Apricot · BurlyWood · Warm Sun

HEX
#DEA785
RGB
rgb(222, 167, 133)
HSL
hsl(23, 57%, 70%)
HSB
hsb(23, 40%, 87%)
CMYK
cmyk(0%, 25%, 40%, 13%)
Oklch
oklch(77.1% 0.080 52.9)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5B5C6E
6C6C5A

Analogous

5A646C
5B5C6E
635A6C

Triadic

5B5C6E
6C5A5B
5B6C5A

Split-Comp.

5B5C6E
6C635A
646C5A

Tetradic

5B5C6E
6C5A64
6C6C5A
5A6C63

Contrast Matrix WCAG 2.1 Contrast

5B5C6E
6F6B87
996E88
C98679
DEA785
—
1.3
Fail
1.5
Fail
2.2
Fail
3.1
AA Large
1.3
Fail
—
1.2
Fail
1.7
Fail
2.4
Fail
1.5
Fail
1.2
Fail
—
1.5
Fail
2.0
Fail
2.2
Fail
1.7
Fail
1.5
Fail
—
1.4
Fail
3.1
AA Large
2.4
Fail
2.0
Fail
1.4
Fail
—
White BG
6.6AA
5.1AA
4.3AA Large
2.9Fail
2.1Fail
Black BG
3.2AA Large
4.1AA Large
4.9AA
7.2AAA
10.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5B6A
6D6D80
868682
ACAB7C
C6C68D

Deuteranopia

5B5B69
6E6E7F
898C80
B0B57D
C9CD8F

Tritanopia

5B6665
6F7B7A
977D7C
C67F7F
DB9495

Achromatopsia

5E5E5E
6F6F6F
7E7E7E
999999
B4B4B4

Shades & Tints Shades & Tints

#5B5C6E

Dark
Light

#6F6B87

Dark
Light

#996E88

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5b5c6e;
  --color-2: #6f6b87;
  --color-3: #996e88;
  --color-4: #c98679;
  --color-5: #dea785;
}

SCSS

$color-1: #5b5c6e;
$color-2: #6f6b87;
$color-3: #996e88;
$color-4: #c98679;
$color-5: #dea785;

TAILWIND

colors: {
  'brand-1': '#5b5c6e',
  'brand-2': '#6f6b87',
  'brand-3': '#996e88',
  'brand-4': '#c98679',
  'brand-5': '#dea785',
}

RGB Array

[91, 92, 110], [111, 107, 135], [153, 110, 136], [201, 134, 121], [222, 167, 133]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This sunset-style palette of #5B5C6E, #6F6B87, #996E88, #C98679, #DEA785 is ideal for: brand design, premium product pages, magazine layouts. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #5b5c6e; --color-2: #6f6b87; --color-3: #996e88; --color-4: #c98679; --color-5: #dea785. 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. 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. Restrained colors convey professionalism and trust. 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