← Back to Editor

#880088 · #883388 · #886688 · #889988 · #88CC88

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#880088

Rose Purple · DarkMagenta · Eggplant

HEX
#880088
RGB
rgb(136, 0, 136)
HSL
hsl(300, 100%, 27%)
HSB
hsb(300, 100%, 53%)
CMYK
cmyk(0%, 100%, 0%, 47%)
Oklch
oklch(44.0% 0.202 328.4)

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

#883388

Rose Purple · DarkMagenta · Eggplant

HEX
#883388
RGB
rgb(136, 51, 136)
HSL
hsl(300, 45%, 37%)
HSB
hsb(300, 63%, 53%)
CMYK
cmyk(0%, 63%, 0%, 47%)
Oklch
oklch(47.5% 0.157 327.7)

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

#886688

Rose Purple · Gray · Violet

HEX
#886688
RGB
rgb(136, 102, 136)
HSL
hsl(300, 14%, 47%)
HSB
hsb(300, 25%, 53%)
CMYK
cmyk(0%, 25%, 0%, 47%)
Oklch
oklch(55.6% 0.066 326.4)

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

#889988

Celadon · Gray · Silver Sand

HEX
#889988
RGB
rgb(136, 153, 136)
HSL
hsl(120, 8%, 57%)
HSB
hsb(120, 11%, 60%)
CMYK
cmyk(11%, 0%, 11%, 40%)
Oklch
oklch(66.4% 0.031 145.2)

Traditional「Celadon」· Paint「Silver Sand」· Creative Urban Concrete

#88CC88

Celadon · DarkSeaGreen · Apple Green

HEX
#88CC88
RGB
rgb(136, 204, 136)
HSL
hsl(120, 40%, 67%)
HSB
hsb(120, 33%, 80%)
CMYK
cmyk(33%, 0%, 33%, 20%)
Oklch
oklch(78.2% 0.117 144.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

880088
008A00

Analogous

45008A
880088
8A0045

Triadic

880088
8A8A00
008A8A

Split-Comp.

880088
458A00
008A45

Tetradic

880088
8A4500
008A00
00458A

Contrast Matrix WCAG 2.1 Contrast

880088
883388
886688
889988
88CC88
—
1.2
Fail
1.8
Fail
2.9
Fail
4.6
AA
1.2
Fail
—
1.5
Fail
2.4
Fail
3.8
AA Large
1.8
Fail
1.5
Fail
—
1.6
Fail
2.6
Fail
2.9
Fail
2.4
Fail
1.6
Fail
—
1.6
Fail
4.6
AA
3.8
AA Large
2.6
Fail
1.6
Fail
—
White BG
8.7AAA
7.3AAA
4.9AA
3.0AA Large
1.9Fail
Black BG
2.4Fail
2.9Fail
4.3AA Large
7.0AA
11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

4D4C67
636273
797980
8F908C
A5A698

Deuteranopia

555F5F
686E6E
7B7E7E
8E8D8D
A29C9C

Tritanopia

814D47
846360
867978
898F90
8BA5A8

Achromatopsia

383838
565656
747474
929292
B0B0B0

Shades & Tints Shades & Tints

#880088

Dark
Light

#883388

Dark
Light

#886688

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #880088;
  --color-2: #883388;
  --color-3: #886688;
  --color-4: #889988;
  --color-5: #88cc88;
}

SCSS

$color-1: #880088;
$color-2: #883388;
$color-3: #886688;
$color-4: #889988;
$color-5: #88cc88;

TAILWIND

colors: {
  'brand-1': '#880088',
  'brand-2': '#883388',
  'brand-3': '#886688',
  'brand-4': '#889988',
  'brand-5': '#88cc88',
}

RGB Array

[136, 0, 136], [136, 51, 136], [136, 102, 136], [136, 153, 136], [136, 204, 136]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #880088, #883388, #886688, #889988, #88CC88 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: #880088; --color-2: #883388; --color-3: #886688; --color-4: #889988; --color-5: #88cc88. 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