← Back to Editor

#AE7BD8 · #837076 · #F820FC · #685550 · #0C6B69

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 LibraryData Visualization

Color Details Color Details

#AE7BD8

Lilac · MediumOrchid · Lilac Purple

HEX
#AE7BD8
RGB
rgb(174, 123, 216)
HSL
hsl(273, 54%, 66%)
HSB
hsb(273, 43%, 85%)
CMYK
cmyk(19%, 43%, 0%, 15%)
Oklch
oklch(67.0% 0.143 308.3)

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

#837076

Dark Violet · Gray · Warm Gray

HEX
#837076
RGB
rgb(131, 112, 118)
HSL
hsl(341, 8%, 48%)
HSB
hsb(341, 15%, 51%)
CMYK
cmyk(0%, 15%, 10%, 49%)
Oklch
oklch(56.5% 0.025 356.9)

Traditional「Dark Violet」· Paint「Warm Gray」· Creative Urban Concrete

#F820FC

Royal Purple · Magenta · Violet

HEX
#F820FC
RGB
rgb(248, 32, 252)
HSL
hsl(299, 97%, 56%)
HSB
hsb(299, 87%, 99%)
CMYK
cmyk(2%, 87%, 0%, 1%)
Oklch
oklch(69.6% 0.309 327.4)

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

#685550

Crimson · DimGray · Wine Red

HEX
#685550
RGB
rgb(104, 85, 80)
HSL
hsl(12, 13%, 36%)
HSB
hsb(12, 23%, 41%)
CMYK
cmyk(0%, 18%, 23%, 59%)
Oklch
oklch(46.7% 0.027 35.1)

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

#0C6B69

Mineral Blue · Teal · Peacock Green

HEX
#0C6B69
RGB
rgb(12, 107, 105)
HSL
hsl(179, 80%, 23%)
HSB
hsb(179, 89%, 42%)
CMYK
cmyk(89%, 0%, 2%, 58%)
Oklch
oklch(47.8% 0.079 192.5)

Traditional「Mineral Blue」· Paint「Peacock Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AE7BD8
A4D779

Analogous

7E79D7
AE7BD8
D779D2

Triadic

AE7BD8
D7AD79
79D7AD

Split-Comp.

AE7BD8
D2D779
79D77E

Tetradic

AE7BD8
D77E79
A4D779
79D2D7

Contrast Matrix WCAG 2.1 Contrast

AE7BD8
837076
F820FC
685550
0C6B69
—
1.5
Fail
1.0
Fail
2.2
Fail
2.0
Fail
1.5
Fail
—
1.5
Fail
1.5
Fail
1.4
Fail
1.0
Fail
1.5
Fail
—
2.2
Fail
2.0
Fail
2.2
Fail
1.5
Fail
2.2
Fail
—
1.1
Fail
2.0
Fail
1.4
Fail
2.0
Fail
1.1
Fail
—
White BG
3.2AA Large
4.6AA
3.2AA Large
7.0AA
6.3AA
Black BG
6.6AA
4.5AA
6.6AA
3.0AA Large
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

9897C1
7B7B75
9A99C7
606051
353669

Deuteranopia

9B9FBC
7C7D74
A7B7BA
616252
30296A

Tritanopia

ABB0AC
827373
ED9D94
675252
116A6A

Achromatopsia

959595
767676
7A7A7A
5A5A5A
4E4E4E

Shades & Tints Shades & Tints

#AE7BD8

Dark
Light

#837076

Dark
Light

#F820FC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ae7bd8;
  --color-2: #837076;
  --color-3: #f820fc;
  --color-4: #685550;
  --color-5: #0c6b69;
}

SCSS

$color-1: #ae7bd8;
$color-2: #837076;
$color-3: #f820fc;
$color-4: #685550;
$color-5: #0c6b69;

TAILWIND

colors: {
  'brand-1': '#ae7bd8',
  'brand-2': '#837076',
  'brand-3': '#f820fc',
  'brand-4': '#685550',
  'brand-5': '#0c6b69',
}

RGB Array

[174, 123, 216], [131, 112, 118], [248, 32, 252], [104, 85, 80], [12, 107, 105]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AE7BD8, #837076, #F820FC, #685550, #0C6B69 is ideal for: infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #ae7bd8; --color-2: #837076; --color-3: #f820fc; --color-4: #685550; --color-5: #0c6b69. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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