← Back to Editor

#8EC5DA · #C58EDA · #BB4DA5 · #BB1449 · #8C252A

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 Library

Color Details Color Details

#8EC5DA

Sky Blue · SkyBlue · Lake Green

HEX
#8EC5DA
RGB
rgb(142, 197, 218)
HSL
hsl(197, 51%, 71%)
HSB
hsb(197, 35%, 85%)
CMYK
cmyk(35%, 10%, 0%, 15%)
Oklch
oklch(79.3% 0.064 223.6)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#C58EDA

Lilac · Orchid · Lilac Purple

HEX
#C58EDA
RGB
rgb(197, 142, 218)
HSL
hsl(283, 51%, 71%)
HSB
hsb(283, 35%, 85%)
CMYK
cmyk(10%, 35%, 0%, 15%)
Oklch
oklch(72.7% 0.122 316.4)

Traditional「Lilac」· Paint「Lilac Purple」· Creative Lavender Dream

#BB4DA5

Rose Purple · MediumOrchid · Violet

HEX
#BB4DA5
RGB
rgb(187, 77, 165)
HSL
hsl(312, 45%, 52%)
HSB
hsb(312, 59%, 73%)
CMYK
cmyk(0%, 59%, 12%, 27%)
Oklch
oklch(59.3% 0.175 336.1)

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

#BB1449

Dark Violet · Crimson · Camellia

HEX
#BB1449
RGB
rgb(187, 20, 73)
HSL
hsl(341, 81%, 41%)
HSB
hsb(341, 89%, 73%)
CMYK
cmyk(0%, 89%, 61%, 27%)
Oklch
oklch(51.2% 0.195 11.6)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

#8C252A

Crimson · Brown · Wine Red

HEX
#8C252A
RGB
rgb(140, 37, 42)
HSL
hsl(357, 58%, 35%)
HSB
hsb(357, 74%, 55%)
CMYK
cmyk(0%, 74%, 70%, 45%)
Oklch
oklch(43.0% 0.138 22.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8EC5DA
DBA58F

Analogous

8FDBCA
8EC5DA
8FA0DB

Triadic

8EC5DA
DB8FC5
C5DB8F

Split-Comp.

8EC5DA
DB8FA0
DBCA8F

Tetradic

8EC5DA
CA8FDB
DBA58F
A0DB8F

Contrast Matrix WCAG 2.1 Contrast

8EC5DA
C58EDA
BB4DA5
BB1449
8C252A
—
1.4
Fail
2.4
Fail
3.4
AA Large
4.6
AA
1.4
Fail
—
1.7
Fail
2.5
Fail
3.4
AA Large
2.4
Fail
1.7
Fail
—
1.4
Fail
2.0
Fail
3.4
AA Large
2.5
Fail
1.4
Fail
—
1.4
Fail
4.6
AA
3.4
AA Large
2.0
Fail
1.4
Fail
—
White BG
1.9Fail
2.5Fail
4.5AA Large
6.3AA
8.7AAA
Black BG
11.1AAA
8.3AAA
4.7AA
3.3AA Large
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A6A6D5
ADADC8
8B8A90
73713C
5F5E29

Deuteranopia

A39FD4
B0B4C3
929A8B
7C8939
656D29

Tritanopia

91D1D0
C2B9B6
B67F7B
B33230
872828

Achromatopsia

B7B7B7
A7A7A7
787878
4C4C4C
444444

Shades & Tints Shades & Tints

#8EC5DA

Dark
Light

#C58EDA

Dark
Light

#BB4DA5

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8ec5da;
  --color-2: #c58eda;
  --color-3: #bb4da5;
  --color-4: #bb1449;
  --color-5: #8c252a;
}

SCSS

$color-1: #8ec5da;
$color-2: #c58eda;
$color-3: #bb4da5;
$color-4: #bb1449;
$color-5: #8c252a;

TAILWIND

colors: {
  'brand-1': '#8ec5da',
  'brand-2': '#c58eda',
  'brand-3': '#bb4da5',
  'brand-4': '#bb1449',
  'brand-5': '#8c252a',
}

RGB Array

[142, 197, 218], [197, 142, 218], [187, 77, 165], [187, 20, 73], [140, 37, 42]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8EC5DA, #C58EDA, #BB4DA5, #BB1449, #8C252A 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: #8ec5da; --color-2: #c58eda; --color-3: #bb4da5; --color-4: #bb1449; --color-5: #8c252a. 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