← Back to Editor

#564A78 · #846B80 · #A4C5A6 · #D7CE97 · #CB9F94

space

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

#564A78

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX
#564A78
RGB
rgb(86, 74, 120)
HSL
hsl(256, 24%, 38%)
HSB
hsb(256, 38%, 47%)
CMYK
cmyk(28%, 38%, 0%, 53%)
Oklch
oklch(44.1% 0.075 295.1)

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

#846B80

Rose Purple · Gray · Violet

HEX
#846B80
RGB
rgb(132, 107, 128)
HSL
hsl(310, 10%, 47%)
HSB
hsb(310, 19%, 52%)
CMYK
cmyk(0%, 19%, 3%, 48%)
Oklch
oklch(55.9% 0.044 331.6)

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

#A4C5A6

Celadon · DarkGray · Apple Green

HEX
#A4C5A6
RGB
rgb(164, 197, 166)
HSL
hsl(124, 22%, 71%)
HSB
hsb(124, 17%, 77%)
CMYK
cmyk(17%, 0%, 16%, 23%)
Oklch
oklch(79.1% 0.056 146.6)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

#D7CE97

Fresh Green · BurlyWood · Sunflower

HEX
#D7CE97
RGB
rgb(215, 206, 151)
HSL
hsl(52, 44%, 72%)
HSB
hsb(52, 30%, 84%)
CMYK
cmyk(0%, 4%, 30%, 16%)
Oklch
oklch(84.5% 0.073 99.9)

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

#CB9F94

Peach Pink · Tan · Coral Red

HEX
#CB9F94
RGB
rgb(203, 159, 148)
HSL
hsl(12, 35%, 69%)
HSB
hsb(12, 27%, 80%)
CMYK
cmyk(0%, 22%, 27%, 20%)
Oklch
oklch(74.0% 0.055 34.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

564A78
6C784A

Analogous

4A5478
564A78
6D4A78

Triadic

564A78
78564A
4A7856

Split-Comp.

564A78
786D4A
54784A

Tetradic

564A78
784A54
6C784A
4A786D

Contrast Matrix WCAG 2.1 Contrast

564A78
846B80
A4C5A6
D7CE97
CB9F94
—
1.7
Fail
4.2
AA Large
5.0
AA
3.4
AA Large
1.7
Fail
—
2.5
Fail
3.0
Fail
2.0
Fail
4.2
AA Large
2.5
Fail
—
1.2
Fail
1.2
Fail
5.0
AA
3.0
Fail
1.2
Fail
—
1.5
Fail
3.4
AA Large
2.0
Fail
1.2
Fail
1.5
Fail
—
White BG
7.9AAA
4.8AA
1.9Fail
1.6Fail
2.4Fail
Black BG
2.6Fail
4.4AA Large
11.1AAA
13.2AAA
8.9AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

51516D
79797B
B2B3AE
D3D3A4
B8B897

Deuteranopia

52526A
7B7D7A
B0AEAF
D4D4A8
BBBE97

Tritanopia

556462
837776
A6B3B5
D7AFB1
C99999

Achromatopsia

535353
757575
B8B8B8
CACACA
ABABAB

Shades & Tints Shades & Tints

#564A78

Dark
Light

#846B80

Dark
Light

#A4C5A6

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #564a78;
  --color-2: #846b80;
  --color-3: #a4c5a6;
  --color-4: #d7ce97;
  --color-5: #cb9f94;
}

SCSS

$color-1: #564a78;
$color-2: #846b80;
$color-3: #a4c5a6;
$color-4: #d7ce97;
$color-5: #cb9f94;

TAILWIND

colors: {
  'brand-1': '#564a78',
  'brand-2': '#846b80',
  'brand-3': '#a4c5a6',
  'brand-4': '#d7ce97',
  'brand-5': '#cb9f94',
}

RGB Array

[86, 74, 120], [132, 107, 128], [164, 197, 166], [215, 206, 151], [203, 159, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #564A78, #846B80, #A4C5A6, #D7CE97, #CB9F94 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: #564a78; --color-2: #846b80; --color-3: #a4c5a6; --color-4: #d7ce97; --color-5: #cb9f94. 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 space-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