#706575 + #CB821B + #C28FAE + #A8ABD6 + #C2C3E1 · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#706575

Ink Gray · DimGray · Warm Gray

HEX

#706575

RGB

rgb(112, 101, 117)

HSL

hsl(281, 7%, 43%)

HSB

hsb(281, 14%, 46%)

CMYK

cmyk(4%, 14%, 0%, 54%)

Oklch

oklch(52.3% 0.028 315.4)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#CB821B

Ochre · DarkGoldenRod · Amber Brown

HEX

#CB821B

RGB

rgb(203, 130, 27)

HSL

hsl(35, 77%, 45%)

HSB

hsb(35, 87%, 80%)

CMYK

cmyk(0%, 36%, 87%, 20%)

Oklch

oklch(66.8% 0.139 68.4)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

#C28FAE

Mauve · DarkGray · Rose Pink

HEX

#C28FAE

RGB

rgb(194, 143, 174)

HSL

hsl(324, 29%, 66%)

HSB

hsb(324, 26%, 76%)

CMYK

cmyk(0%, 26%, 10%, 24%)

Oklch

oklch(70.9% 0.074 342.1)

Traditional「Mauve」· Paint「Rose Pink」· Creative Rose Petal

#A8ABD6

Azure · LightSteelBlue · Cobalt Blue

HEX

#A8ABD6

RGB

rgb(168, 171, 214)

HSL

hsl(236, 36%, 75%)

HSB

hsb(236, 21%, 84%)

CMYK

cmyk(21%, 20%, 0%, 16%)

Oklch

oklch(75.4% 0.062 281.7)

Traditional「Azure」· Paint「Cobalt Blue」· Creative Twilight Haze

#C2C3E1

Azure · LightSteelBlue · Sky Blue

HEX

#C2C3E1

RGB

rgb(194, 195, 225)

HSL

hsl(238, 34%, 82%)

HSB

hsb(238, 14%, 88%)

CMYK

cmyk(14%, 13%, 0%, 12%)

Oklch

oklch(82.6% 0.042 283.9)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

706575

6B7566

Analogous

696675

706575

756673

Triadic

706575

757066

667570

Split-Comp.

706575

737566

667569

Tetradic

706575

756966

6B7566

667375

Contrast Matrix WCAG 2.1 Contrast

706575	CB821B	C28FAE	A8ABD6	C2C3E1
—	1.8 Fail	2.1 Fail	2.5 Fail	3.2 AA Large
1.8 Fail	—	1.2 Fail	1.4 Fail	1.8 Fail
2.1 Fail	1.2 Fail	—	1.2 Fail	1.6 Fail
2.5 Fail	1.4 Fail	1.2 Fail	—	1.3 Fail
3.2 AA Large	1.8 Fail	1.6 Fail	1.3 Fail	—

White BG

5.5AA

3.1AA Large

2.7Fail

2.2Fail

1.7Fail

Black BG

3.8AA Large

6.7AA

7.8AAA

9.5AAA

12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

6B6B71

ABAB34

ACABA6

A9A9CC

C2C2DA

Deuteranopia

6C6D70

B0B53A

AFB3A5

A9A9C9

C2C2D8

Tritanopia

6F6E6D

C7484C

BFA19F

A8C3C2

C2D4D3

Achromatopsia

6A6A6A

8C8C8C

A2A2A2

AFAFAF

C6C6C6

Shades & Tints Shades & Tints

#706575

Dark

Light

#CB821B

Dark

Light

#C28FAE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #706575;
  --color-2: #cb821b;
  --color-3: #c28fae;
  --color-4: #a8abd6;
  --color-5: #c2c3e1;
}

SCSS

$color-1: #706575;
$color-2: #cb821b;
$color-3: #c28fae;
$color-4: #a8abd6;
$color-5: #c2c3e1;

TAILWIND

colors: {
  'brand-1': '#706575',
  'brand-2': '#cb821b',
  'brand-3': '#c28fae',
  'brand-4': '#a8abd6',
  'brand-5': '#c2c3e1',
}

RGB Array

[112, 101, 117], [203, 130, 27], [194, 143, 174], [168, 171, 214], [194, 195, 225]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #706575, #CB821B, #C28FAE, #A8ABD6, #C2C3E1 is ideal for: corporate websites, product showcases, portfolios. 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: #706575; --color-2: #cb821b; --color-3: #c28fae; --color-4: #a8abd6; --color-5: #c2c3e1. 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. 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