#360536 + #3E1C50 + #1C687D + #7F7B8C + #BCB434 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#360536

Rose Purple · MidnightBlue · Dark Purple

HEX

#360536

RGB

rgb(54, 5, 54)

HSL

hsl(300, 83%, 12%)

HSB

hsb(300, 91%, 21%)

CMYK

cmyk(0%, 91%, 0%, 79%)

Oklch

oklch(24.0% 0.099 328.1)

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

#3E1C50

Dark Plum · MidnightBlue · Eggplant

HEX

#3E1C50

RGB

rgb(62, 28, 80)

HSL

hsl(279, 48%, 21%)

HSB

hsb(279, 65%, 31%)

CMYK

cmyk(22%, 65%, 0%, 69%)

Oklch

oklch(30.1% 0.096 312.2)

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

#1C687D

Lake Blue · Teal · Mint Ice

HEX

#1C687D

RGB

rgb(28, 104, 125)

HSL

hsl(193, 63%, 30%)

HSB

hsb(193, 78%, 49%)

CMYK

cmyk(78%, 17%, 0%, 51%)

Oklch

oklch(48.2% 0.078 220.7)

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

#7F7B8C

Ash · Gray · Warm Gray

HEX

#7F7B8C

RGB

rgb(127, 123, 140)

HSL

hsl(254, 7%, 52%)

HSB

hsb(254, 12%, 55%)

CMYK

cmyk(9%, 12%, 0%, 45%)

Oklch

oklch(59.2% 0.026 296.4)

Traditional「Ash」· Paint「Warm Gray」· Creative Urban Concrete

#BCB434

Autumn Sage · GoldenRod · Honey Gold

HEX

#BCB434

RGB

rgb(188, 180, 52)

HSL

hsl(56, 57%, 47%)

HSB

hsb(56, 72%, 74%)

CMYK

cmyk(0%, 4%, 72%, 26%)

Oklch

oklch(75.4% 0.143 105.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

360536

053805

Analogous

1F0538

360536

38051F

Triadic

360536

383805

053838

Split-Comp.

360536

1F3805

05381F

Tetradic

360536

381F05

053805

051F38

Contrast Matrix WCAG 2.1 Contrast

360536	3E1C50	1C687D	7F7B8C	BCB434
—	1.2 Fail	2.7 Fail	4.2 AA Large	7.9 AAA
1.2 Fail	—	2.2 Fail	3.4 AA Large	6.5 AA
2.7 Fail	2.2 Fail	—	1.5 Fail	2.9 Fail
4.2 AA Large	3.4 AA Large	1.5 Fail	—	1.9 Fail
7.9 AAA	6.5 AA	2.9 Fail	1.9 Fail	—

White BG

17.0AAA

14.1AAA

6.3AA

4.1AA Large

2.2Fail

Black BG

1.2Fail

1.5Fail

3.3AA Large

5.1AA

9.7AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

21202A

2F2F43

3D3E78

7D7D88

B9B853

Deuteranopia

242727

313440

393377

7E7E87

B9BA5A

Tritanopia

34211F

3C3937

207473

7F8584

BC6B71

Achromatopsia

191919

2C2C2C

545454

7E7E7E

A8A8A8

Shades & Tints Shades & Tints

#360536

Dark

Light

#3E1C50

Dark

Light

#1C687D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #360536;
  --color-2: #3e1c50;
  --color-3: #1c687d;
  --color-4: #7f7b8c;
  --color-5: #bcb434;
}

SCSS

$color-1: #360536;
$color-2: #3e1c50;
$color-3: #1c687d;
$color-4: #7f7b8c;
$color-5: #bcb434;

TAILWIND

colors: {
  'brand-1': '#360536',
  'brand-2': '#3e1c50',
  'brand-3': '#1c687d',
  'brand-4': '#7f7b8c',
  'brand-5': '#bcb434',
}

RGB Array

[54, 5, 54], [62, 28, 80], [28, 104, 125], [127, 123, 140], [188, 180, 52]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #360536, #3E1C50, #1C687D, #7F7B8C, #BCB434 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: #360536; --color-2: #3e1c50; --color-3: #1c687d; --color-4: #7f7b8c; --color-5: #bcb434. 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 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