#832EB8 + #5E68B5 + #2E97B8 + #1AB8B0 + #78D66B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#832EB8

Royal Purple · DarkOrchid · Violet

HEX

#832EB8

RGB

rgb(131, 46, 184)

HSL

hsl(277, 60%, 45%)

HSB

hsb(277, 75%, 72%)

CMYK

cmyk(29%, 75%, 0%, 28%)

Oklch

oklch(49.4% 0.206 308.6)

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

#5E68B5

Azure · SlateBlue · Navy Blue

HEX

#5E68B5

RGB

rgb(94, 104, 181)

HSL

hsl(233, 37%, 54%)

HSB

hsb(233, 48%, 71%)

CMYK

cmyk(48%, 43%, 0%, 29%)

Oklch

oklch(54.5% 0.120 276.1)

Traditional「Azure」· Paint「Navy Blue」· Creative Blush Sunrise

#2E97B8

Lake Blue · SteelBlue · Mint Ice

HEX

#2E97B8

RGB

rgb(46, 151, 184)

HSL

hsl(194, 60%, 45%)

HSB

hsb(194, 75%, 72%)

CMYK

cmyk(75%, 18%, 0%, 28%)

Oklch

oklch(63.2% 0.104 223.5)

Traditional「Lake Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#1AB8B0

Mineral Blue · LightSeaGreen · Mint Ice

HEX

#1AB8B0

RGB

rgb(26, 184, 176)

HSL

hsl(177, 75%, 41%)

HSB

hsb(177, 86%, 72%)

CMYK

cmyk(86%, 0%, 4%, 28%)

Oklch

oklch(70.8% 0.119 189.2)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#78D66B

Emerald · DarkSeaGreen · Apple Green

HEX

#78D66B

RGB

rgb(120, 214, 107)

HSL

hsl(113, 57%, 63%)

HSB

hsb(113, 50%, 84%)

CMYK

cmyk(44%, 0%, 50%, 16%)

Oklch

oklch(79.3% 0.170 141.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

832EB8

63B82E

Analogous

3E2EB8

832EB8

B82EA8

Triadic

832EB8

B8832E

2EB883

Split-Comp.

832EB8

A8B82E

2EB83E

Tetradic

832EB8

B83E2E

63B82E

2EA8B8

Contrast Matrix WCAG 2.1 Contrast

832EB8	5E68B5	2E97B8	1AB8B0	78D66B
—	1.4 Fail	2.0 Fail	2.8 Fail	3.8 AA Large
1.4 Fail	—	1.5 Fail	2.1 Fail	2.8 Fail
2.0 Fail	1.5 Fail	—	1.4 Fail	1.9 Fail
2.8 Fail	2.1 Fail	1.4 Fail	—	1.4 Fail
3.8 AA Large	2.8 Fail	1.9 Fail	1.4 Fail	—

White BG

6.9AA

5.1AA

3.4AA Large

2.5Fail

1.8Fail

Black BG

3.0AA Large

4.1AA Large

6.2AA

8.5AAA

11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5E5D97

6262A2

5B5CB0

5E60B2

A1A285

Deuteranopia

63698F

62619E

554EAE

5549B2

9B948B

Tritanopia

7F7C76

5F9490

33AAA8

22B3B4

7D999E

Achromatopsia

575757

6E6E6E

7B7B7B

888888

AEAEAE

Shades & Tints Shades & Tints

#832EB8

Dark

Light

#5E68B5

Dark

Light

#2E97B8

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #832eb8;
  --color-2: #5e68b5;
  --color-3: #2e97b8;
  --color-4: #1ab8b0;
  --color-5: #78d66b;
}

SCSS

$color-1: #832eb8;
$color-2: #5e68b5;
$color-3: #2e97b8;
$color-4: #1ab8b0;
$color-5: #78d66b;

TAILWIND

colors: {
  'brand-1': '#832eb8',
  'brand-2': '#5e68b5',
  'brand-3': '#2e97b8',
  'brand-4': '#1ab8b0',
  'brand-5': '#78d66b',
}

RGB Array

[131, 46, 184], [94, 104, 181], [46, 151, 184], [26, 184, 176], [120, 214, 107]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #832EB8, #5E68B5, #2E97B8, #1AB8B0, #78D66B 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: #832eb8; --color-2: #5e68b5; --color-3: #2e97b8; --color-4: #1ab8b0; --color-5: #78d66b. 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