#7E33CF + #6C59CA + #5A80C5 + #48A6C0 + #37CDBC - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#7E33CF

Deep Indigo · DarkOrchid · Violet

HEX

#7E33CF

RGB

rgb(126, 51, 207)

HSL

hsl(269, 62%, 51%)

HSB

hsb(269, 75%, 81%)

CMYK

cmyk(39%, 75%, 0%, 19%)

Oklch

oklch(51.1% 0.223 300.3)

Traditional「Deep Indigo」· Paint「Violet」· Creative Blush Sunrise

#6C59CA

Deep Indigo · SlateBlue · Navy Blue

HEX

#6C59CA

RGB

rgb(108, 89, 202)

HSL

hsl(250, 52%, 57%)

HSB

hsb(250, 56%, 79%)

CMYK

cmyk(47%, 56%, 0%, 21%)

Oklch

oklch(54.1% 0.168 287.1)

Traditional「Deep Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

#5A80C5

Azure · SteelBlue · Navy Blue

HEX

#5A80C5

RGB

rgb(90, 128, 197)

HSL

hsl(219, 48%, 56%)

HSB

hsb(219, 54%, 77%)

CMYK

cmyk(54%, 35%, 0%, 23%)

Oklch

oklch(60.2% 0.114 261.6)

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

#48A6C0

Slate Blue · SteelBlue · Lake Green

HEX

#48A6C0

RGB

rgb(72, 166, 192)

HSL

hsl(193, 49%, 52%)

HSB

hsb(193, 63%, 75%)

CMYK

cmyk(63%, 14%, 0%, 25%)

Oklch

oklch(67.9% 0.096 219.0)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#37CDBC

Mineral Blue · MediumTurquoise · Lake Green

HEX

#37CDBC

RGB

rgb(55, 205, 188)

HSL

hsl(173, 60%, 51%)

HSB

hsb(173, 73%, 80%)

CMYK

cmyk(73%, 0%, 8%, 20%)

Oklch

oklch(76.8% 0.124 183.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

7E33CF

85D035

Analogous

3537D0

7E33CF

CD35D0

Triadic

7E33CF

D07F35

35D07F

Split-Comp.

7E33CF

D0CD35

37D035

Tetradic

7E33CF

D03537

85D035

35D0CD

Contrast Matrix WCAG 2.1 Contrast

7E33CF	6C59CA	5A80C5	48A6C0	37CDBC
—	1.2 Fail	1.6 Fail	2.3 Fail	3.3 AA Large
1.2 Fail	—	1.4 Fail	1.9 Fail	2.7 Fail
1.6 Fail	1.4 Fail	—	1.4 Fail	2.0 Fail
2.3 Fail	1.9 Fail	1.4 Fail	—	1.4 Fail
3.3 AA Large	2.7 Fail	2.0 Fail	1.4 Fail	—

White BG

6.4AA

5.4AA

3.9AA Large

2.8Fail

2.0Fail

Black BG

3.3AA Large

3.9AA Large

5.3AA

7.5AAA

10.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

5E5DA9

6464AF

6A6BB4

7172BA

7879C0

Deuteranopia

6267A0

6566A8

6865B0

6B64B8

6F64C1

Tritanopia

7A8B85

6B9994

5CA7A4

4DB5B4

3FC3C4

Achromatopsia

5B5B5B

6C6C6C

7D7D7D

8D8D8D

9E9E9E

Shades & Tints Shades & Tints

#7E33CF

Dark

Light

#6C59CA

Dark

Light

#5A80C5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #7e33cf;
  --color-2: #6c59ca;
  --color-3: #5a80c5;
  --color-4: #48a6c0;
  --color-5: #37cdbc;
}

SCSS

$color-1: #7e33cf;
$color-2: #6c59ca;
$color-3: #5a80c5;
$color-4: #48a6c0;
$color-5: #37cdbc;

TAILWIND

colors: {
  'brand-1': '#7e33cf',
  'brand-2': '#6c59ca',
  'brand-3': '#5a80c5',
  'brand-4': '#48a6c0',
  'brand-5': '#37cdbc',
}

RGB Array

[126, 51, 207], [108, 89, 202], [90, 128, 197], [72, 166, 192], [55, 205, 188]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #7E33CF, #6C59CA, #5A80C5, #48A6C0, #37CDBC 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: #7e33cf; --color-2: #6c59ca; --color-3: #5a80c5; --color-4: #48a6c0; --color-5: #37cdbc. 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