← Back to Editor

#5A5C75 · #492D49 · #87555C · #E07A6C · #D1B68D

A 5-color palette 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

#5A5C75

Indigo · DimGray · Navy Blue

HEX
#5A5C75
RGB
rgb(90, 92, 117)
HSL
hsl(236, 13%, 41%)
HSB
hsb(236, 23%, 46%)
CMYK
cmyk(23%, 21%, 0%, 54%)
Oklch
oklch(48.3% 0.040 281.2)

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

#492D49

Rose Purple · DarkSlateGray · Eggplant

HEX
#492D49
RGB
rgb(73, 45, 73)
HSL
hsl(300, 24%, 23%)
HSB
hsb(300, 38%, 29%)
CMYK
cmyk(0%, 38%, 0%, 71%)
Oklch
oklch(34.3% 0.060 326.8)

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

#87555C

Crimson · DimGray · Passion Red

HEX
#87555C
RGB
rgb(135, 85, 92)
HSL
hsl(352, 23%, 43%)
HSB
hsb(352, 37%, 53%)
CMYK
cmyk(0%, 37%, 32%, 47%)
Oklch
oklch(50.7% 0.067 10.6)

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

#E07A6C

Peach Pink · LightCoral · Coral Red

HEX
#E07A6C
RGB
rgb(224, 122, 108)
HSL
hsl(7, 65%, 65%)
HSB
hsb(7, 52%, 88%)
CMYK
cmyk(0%, 46%, 52%, 12%)
Oklch
oklch(69.0% 0.129 29.0)

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

#D1B68D

Ginger · Tan · Warm Sun

HEX
#D1B68D
RGB
rgb(209, 182, 141)
HSL
hsl(36, 42%, 69%)
HSB
hsb(36, 33%, 82%)
CMYK
cmyk(0%, 13%, 33%, 18%)
Oklch
oklch(78.9% 0.063 78.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5A5C75
76745B

Analogous

5B6A76
5A5C75
675B76

Triadic

5A5C75
765B5D
5D765B

Split-Comp.

5A5C75
76675B
6A765B

Tetradic

5A5C75
765B6A
76745B
5B7667

Contrast Matrix WCAG 2.1 Contrast

5A5C75
492D49
87555C
E07A6C
D1B68D
—
1.8
Fail
1.1
Fail
2.2
Fail
3.3
AA Large
1.8
Fail
—
2.0
Fail
4.1
AA Large
6.1
AA
1.1
Fail
2.0
Fail
—
2.1
Fail
3.1
AA Large
2.2
Fail
4.1
AA Large
2.1
Fail
—
1.5
Fail
3.3
AA Large
6.1
AA
3.1
AA Large
1.5
Fail
—
White BG
6.5AA
12.0AAA
6.0AA
2.9Fail
1.9Fail
Black BG
3.2AA Large
1.8Fail
3.5AA Large
7.2AAA
10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5B6F
3D3D42
71715A
B4B36F
C5C597

Deuteranopia

5B5B6D
3F4141
74785A
BAC170
C7C999

Tritanopia

5A6A69
483D3C
855959
DB7273
D09FA0

Achromatopsia

5E5E5E
393939
656565
979797
B9B9B9

Shades & Tints Shades & Tints

#5A5C75

Dark
Light

#492D49

Dark
Light

#87555C

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5a5c75;
  --color-2: #492d49;
  --color-3: #87555c;
  --color-4: #e07a6c;
  --color-5: #d1b68d;
}

SCSS

$color-1: #5a5c75;
$color-2: #492d49;
$color-3: #87555c;
$color-4: #e07a6c;
$color-5: #d1b68d;

TAILWIND

colors: {
  'brand-1': '#5a5c75',
  'brand-2': '#492d49',
  'brand-3': '#87555c',
  'brand-4': '#e07a6c',
  'brand-5': '#d1b68d',
}

RGB Array

[90, 92, 117], [73, 45, 73], [135, 85, 92], [224, 122, 108], [209, 182, 141]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5A5C75, #492D49, #87555C, #E07A6C, #D1B68D 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: #5a5c75; --color-2: #492d49; --color-3: #87555c; --color-4: #e07a6c; --color-5: #d1b68d. 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 general-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