#88A0C6 + #8F84C6 + #A469A3 + #984D88 + #C62E81 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#88A0C6

Azure · DarkGray · Cobalt Blue

HEX

#88A0C6

RGB

rgb(136, 160, 198)

HSL

hsl(217, 35%, 65%)

HSB

hsb(217, 31%, 78%)

CMYK

cmyk(31%, 19%, 0%, 22%)

Oklch

oklch(70.1% 0.062 259.5)

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

#8F84C6

Wisteria · LightSlateGray · Cobalt Blue

HEX

#8F84C6

RGB

rgb(143, 132, 198)

HSL

hsl(250, 37%, 65%)

HSB

hsb(250, 33%, 78%)

CMYK

cmyk(28%, 33%, 0%, 22%)

Oklch

oklch(64.9% 0.098 291.1)

Traditional「Wisteria」· Paint「Cobalt Blue」· Creative Lavender Dream

#A469A3

Rose Purple · Gray · Violet

HEX

#A469A3

RGB

rgb(164, 105, 163)

HSL

hsl(301, 24%, 53%)

HSB

hsb(301, 36%, 64%)

CMYK

cmyk(0%, 36%, 1%, 36%)

Oklch

oklch(60.4% 0.109 327.4)

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

#984D88

Rose Purple · Gray · Violet

HEX

#984D88

RGB

rgb(152, 77, 136)

HSL

hsl(313, 33%, 45%)

HSB

hsb(313, 49%, 60%)

CMYK

cmyk(0%, 49%, 11%, 40%)

Oklch

oklch(53.2% 0.125 335.8)

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

#C62E81

Rose Purple · MediumVioletRed · Camellia

HEX

#C62E81

RGB

rgb(198, 46, 129)

HSL

hsl(327, 62%, 48%)

HSB

hsb(327, 77%, 78%)

CMYK

cmyk(0%, 77%, 35%, 22%)

Oklch

oklch(56.4% 0.200 352.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

88A0C6

C5AD87

Analogous

87BEC5

88A0C6

8E87C5

Triadic

88A0C6

C5879E

9EC587

Split-Comp.

88A0C6

C58E87

BEC587

Tetradic

88A0C6

C587BE

C5AD87

87C58E

Contrast Matrix WCAG 2.1 Contrast

88A0C6	8F84C6	A469A3	984D88	C62E81
—	1.3 Fail	1.5 Fail	2.1 Fail	1.9 Fail
1.3 Fail	—	1.2 Fail	1.7 Fail	1.5 Fail
1.5 Fail	1.2 Fail	—	1.4 Fail	1.2 Fail
2.1 Fail	1.7 Fail	1.4 Fail	—	1.1 Fail
1.9 Fail	1.5 Fail	1.2 Fail	1.1 Fail	—

White BG

2.7Fail

3.3AA Large

4.1AA Large

5.6AA

5.1AA

Black BG

7.9AAA

6.3AA

5.1AA

3.8AA Large

4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

9293BD

8A8AB6

8A8A95

78777A

84836D

Deuteranopia

918FBB

8B8CB2

8E9292

7C8276

8D9868

Tritanopia

89B6B4

8EA9A7

A18A87

946E6C

BE5D5A

Achromatopsia

9D9D9D

8F8F8F

818181

6A6A6A

656565

Shades & Tints Shades & Tints

#88A0C6

Dark

Light

#8F84C6

Dark

Light

#A469A3

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #88a0c6;
  --color-2: #8f84c6;
  --color-3: #a469a3;
  --color-4: #984d88;
  --color-5: #c62e81;
}

SCSS

$color-1: #88a0c6;
$color-2: #8f84c6;
$color-3: #a469a3;
$color-4: #984d88;
$color-5: #c62e81;

TAILWIND

colors: {
  'brand-1': '#88a0c6',
  'brand-2': '#8f84c6',
  'brand-3': '#a469a3',
  'brand-4': '#984d88',
  'brand-5': '#c62e81',
}

RGB Array

[136, 160, 198], [143, 132, 198], [164, 105, 163], [152, 77, 136], [198, 46, 129]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #88A0C6, #8F84C6, #A469A3, #984D88, #C62E81 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: #88a0c6; --color-2: #8f84c6; --color-3: #a469a3; --color-4: #984d88; --color-5: #c62e81. 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 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