#27012B + #5D2F63 + #806185 + #9DAB4D + #D5F803 · bright - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatile

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#27012B

Royal Purple · Black · Dark Purple

HEX

#27012B

RGB

rgb(39, 1, 43)

HSL

hsl(294, 95%, 9%)

HSB

hsb(294, 98%, 17%)

CMYK

cmyk(9%, 98%, 0%, 83%)

Oklch

oklch(19.6% 0.089 324.0)

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

#5D2F63

Dark Plum · DarkSlateBlue · Eggplant

HEX

#5D2F63

RGB

rgb(93, 47, 99)

HSL

hsl(293, 36%, 29%)

HSB

hsb(293, 53%, 39%)

CMYK

cmyk(6%, 53%, 0%, 61%)

Oklch

oklch(38.7% 0.101 322.9)

Traditional「Dark Plum」· Paint「Eggplant」· Creative Blush Sunrise

#806185

Dark Plum · Gray · Violet

HEX

#806185

RGB

rgb(128, 97, 133)

HSL

hsl(292, 16%, 45%)

HSB

hsb(292, 27%, 52%)

CMYK

cmyk(4%, 27%, 0%, 48%)

Oklch

oklch(53.7% 0.066 321.7)

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

#9DAB4D

Autumn Sage · DarkSeaGreen · Honey Gold

HEX

#9DAB4D

RGB

rgb(157, 171, 77)

HSL

hsl(69, 38%, 49%)

HSB

hsb(69, 55%, 67%)

CMYK

cmyk(8%, 0%, 55%, 33%)

Oklch

oklch(71.0% 0.120 116.6)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#D5F803

Autumn Sage · Yellow · Honey Gold

HEX

#D5F803

RGB

rgb(213, 248, 3)

HSL

hsl(69, 98%, 49%)

HSB

hsb(69, 99%, 97%)

CMYK

cmyk(14%, 0%, 99%, 3%)

Oklch

oklch(92.1% 0.217 119.5)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

27012B

062D01

Analogous

13012D

27012B

2D011B

Triadic

27012B

2D2801

012D28

Split-Comp.

27012B

1B2D01

012D13

Tetradic

27012B

2D1301

062D01

011B2D

Contrast Matrix WCAG 2.1 Contrast

27012B	5D2F63	806185	9DAB4D	D5F803
—	1.8 Fail	3.5 AA Large	7.4 AAA	15.3 AAA
1.8 Fail	—	1.9 Fail	4.1 AA Large	8.4 AAA
3.5 AA Large	1.9 Fail	—	2.1 Fail	4.4 AA Large
7.4 AAA	4.1 AA Large	2.1 Fail	—	2.1 Fail
15.3 AAA	8.4 AAA	4.4 AA Large	2.1 Fail	—

White BG

18.7AAA

10.2AAA

5.3AA

2.5Fail

1.2Fail

Black BG

1.1Fail

2.1Fail

4.0AA Large

8.4AAA

17.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

171621

494956

73727C

A3A364

E4E43E

Deuteranopia

191C1E

4C4F53

74777A

A2A169

E2E04C

Tritanopia

251917

5B4C4A

7E7574

9E767A

D76D77

Achromatopsia

111111

434343

6E6E6E

9C9C9C

D2D2D2

Shades & Tints Shades & Tints

#27012B

Dark

Light

#5D2F63

Dark

Light

#806185

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #27012b;
  --color-2: #5d2f63;
  --color-3: #806185;
  --color-4: #9dab4d;
  --color-5: #d5f803;
}

SCSS

$color-1: #27012b;
$color-2: #5d2f63;
$color-3: #806185;
$color-4: #9dab4d;
$color-5: #d5f803;

TAILWIND

colors: {
  'brand-1': '#27012b',
  'brand-2': '#5d2f63',
  'brand-3': '#806185',
  'brand-4': '#9dab4d',
  'brand-5': '#d5f803',
}

RGB Array

[39, 1, 43], [93, 47, 99], [128, 97, 133], [157, 171, 77], [213, 248, 3]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This bright-style palette of #27012B, #5D2F63, #806185, #9DAB4D, #D5F803 is ideal for: tech websites, dark mode UIs, game UIs. 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: #27012b; --color-2: #5d2f63; --color-3: #806185; --color-4: #9dab4d; --color-5: #d5f803. 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?

Dark tones work well as backgrounds; pair with light text for readability. Use the brightest color for CTA buttons and interactive elements. 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 bright-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