#8F53CF + #93CF53 + #53CF8F + #53B2CF + #694DBF - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#8F53CF

Deep Indigo · DarkOrchid · Violet

HEX

#8F53CF

RGB

rgb(143, 83, 207)

HSL

hsl(269, 56%, 57%)

HSB

hsb(269, 60%, 81%)

CMYK

cmyk(31%, 60%, 0%, 19%)

Oklch

oklch(57.0% 0.186 303.3)

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

#93CF53

Grass Green · DarkSeaGreen · Olive Green

HEX

#93CF53

RGB

rgb(147, 207, 83)

HSL

hsl(89, 56%, 57%)

HSB

hsb(89, 60%, 81%)

CMYK

cmyk(29%, 0%, 60%, 19%)

Oklch

oklch(78.8% 0.167 131.1)

Traditional「Grass Green」· Paint「Olive Green」· Creative Blush Sunrise

#53CF8F

Emerald · MediumAquaMarine · Olive Green

HEX

#53CF8F

RGB

rgb(83, 207, 143)

HSL

hsl(149, 56%, 57%)

HSB

hsb(149, 60%, 81%)

CMYK

cmyk(60%, 0%, 31%, 19%)

Oklch

oklch(76.8% 0.145 157.6)

Traditional「Emerald」· Paint「Olive Green」· Creative Blush Sunrise

#53B2CF

Lake Blue · MediumTurquoise · Lake Green

HEX

#53B2CF

RGB

rgb(83, 178, 207)

HSL

hsl(194, 56%, 57%)

HSB

hsb(194, 60%, 81%)

CMYK

cmyk(60%, 14%, 0%, 19%)

Oklch

oklch(71.8% 0.098 220.8)

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

#694DBF

Deep Indigo · SlateBlue · Navy Blue

HEX

#694DBF

RGB

rgb(105, 77, 191)

HSL

hsl(255, 47%, 53%)

HSB

hsb(255, 60%, 75%)

CMYK

cmyk(45%, 60%, 0%, 25%)

Oklch

oklch(51.1% 0.171 290.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

8F53CF

93CF54

Analogous

5456CF

8F53CF

CD54CF

Triadic

8F53CF

CF8F54

54CF8F

Split-Comp.

8F53CF

CFCD54

56CF54

Tetradic

8F53CF

CF5456

93CF54

54CFCD

Contrast Matrix WCAG 2.1 Contrast

8F53CF	93CF53	53CF8F	53B2CF	694DBF
—	2.6 Fail	2.5 Fail	2.0 Fail	1.3 Fail
2.6 Fail	—	1.1 Fail	1.3 Fail	3.3 AA Large
2.5 Fail	1.1 Fail	—	1.2 Fail	3.1 AA Large
2.0 Fail	1.3 Fail	1.2 Fail	—	2.5 Fail
1.3 Fail	3.3 AA Large	3.1 AA Large	2.5 Fail	—

White BG

4.9AA

1.9Fail

2.0Fail

2.4Fail

6.2AA

Black BG

4.3AA Large

11.3AAA

10.7AAA

8.6AAA

3.4AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7574B1

ADAE71

898A9E

7C7DC8

5D5DA3

Deuteranopia

797DAA

AAA578

8278A2

7770C6

5F619D

Tritanopia

8C9994

96898E

59ABAD

58C2C1

688E89

Achromatopsia

737373

AFAFAF

A3A3A3

999999

626262

Shades & Tints Shades & Tints

#8F53CF

Dark

Light

#93CF53

Dark

Light

#53CF8F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #8f53cf;
  --color-2: #93cf53;
  --color-3: #53cf8f;
  --color-4: #53b2cf;
  --color-5: #694dbf;
}

SCSS

$color-1: #8f53cf;
$color-2: #93cf53;
$color-3: #53cf8f;
$color-4: #53b2cf;
$color-5: #694dbf;

TAILWIND

colors: {
  'brand-1': '#8f53cf',
  'brand-2': '#93cf53',
  'brand-3': '#53cf8f',
  'brand-4': '#53b2cf',
  'brand-5': '#694dbf',
}

RGB Array

[143, 83, 207], [147, 207, 83], [83, 207, 143], [83, 178, 207], [105, 77, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #8F53CF, #93CF53, #53CF8F, #53B2CF, #694DBF 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: #8f53cf; --color-2: #93cf53; --color-3: #53cf8f; --color-4: #53b2cf; --color-5: #694dbf. 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