#B4C01A + #51C5B1 + #D58E31 + #955BB1 + #594B5E - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B4C01A

Autumn Sage · GoldenRod · Honey Gold

HEX

#B4C01A

RGB

rgb(180, 192, 26)

HSL

hsl(64, 76%, 43%)

HSB

hsb(64, 86%, 75%)

CMYK

cmyk(6%, 0%, 86%, 25%)

Oklch

oklch(77.3% 0.169 114.3)

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

#51C5B1

Mineral Blue · MediumAquaMarine · Lake Green

HEX

#51C5B1

RGB

rgb(81, 197, 177)

HSL

hsl(170, 50%, 55%)

HSB

hsb(170, 59%, 77%)

CMYK

cmyk(59%, 0%, 10%, 23%)

Oklch

oklch(75.2% 0.109 180.0)

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

#D58E31

Ginger · GoldenRod · Warm Sun

HEX

#D58E31

RGB

rgb(213, 142, 49)

HSL

hsl(34, 66%, 51%)

HSB

hsb(34, 77%, 84%)

CMYK

cmyk(0%, 33%, 77%, 16%)

Oklch

oklch(70.3% 0.135 68.9)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#955BB1

Dark Plum · DarkOrchid · Violet

HEX

#955BB1

RGB

rgb(149, 91, 177)

HSL

hsl(280, 36%, 53%)

HSB

hsb(280, 49%, 69%)

CMYK

cmyk(16%, 49%, 0%, 31%)

Oklch

oklch(57.1% 0.141 313.8)

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

#594B5E

Dark Plum · DimGray · Eggplant

HEX

#594B5E

RGB

rgb(89, 75, 94)

HSL

hsl(284, 11%, 33%)

HSB

hsb(284, 20%, 37%)

CMYK

cmyk(5%, 20%, 0%, 63%)

Oklch

oklch(43.4% 0.035 317.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B4C01A

251AC1

Analogous

C1791A

B4C01A

63C11A

Triadic

B4C01A

1AB6C1

C11AB6

Split-Comp.

B4C01A

1A63C1

791AC1

Tetradic

B4C01A

1AC179

251AC1

C11A63

Contrast Matrix WCAG 2.1 Contrast

B4C01A	51C5B1	D58E31	955BB1	594B5E
—	1.1 Fail	1.4 Fail	2.4 Fail	4.0 AA Large
1.1 Fail	—	1.3 Fail	2.3 Fail	3.8 AA Large
1.4 Fail	1.3 Fail	—	1.8 Fail	3.0 Fail
2.4 Fail	2.3 Fail	1.8 Fail	—	1.7 Fail
4.0 AA Large	3.8 AA Large	3.0 Fail	1.7 Fail	—

White BG

2.0Fail

2.1Fail

2.7Fail

4.8AA

8.1AAA

Black BG

10.5AAA

10.0AAA

7.7AAA

4.4AA Large

2.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B942

8384B6

B6B648

7C7B9C

535359

Deuteranopia

B9B84C

7D74B7

BAC04D

7F8497

545558

Tritanopia

B56269

57BABB

D1595D

928C88

585655

Achromatopsia

A9A9A9

A0A0A0

999999

767676

515151

Shades & Tints Shades & Tints

#B4C01A

Dark

Light

#51C5B1

Dark

Light

#D58E31

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b4c01a;
  --color-2: #51c5b1;
  --color-3: #d58e31;
  --color-4: #955bb1;
  --color-5: #594b5e;
}

SCSS

$color-1: #b4c01a;
$color-2: #51c5b1;
$color-3: #d58e31;
$color-4: #955bb1;
$color-5: #594b5e;

TAILWIND

colors: {
  'brand-1': '#b4c01a',
  'brand-2': '#51c5b1',
  'brand-3': '#d58e31',
  'brand-4': '#955bb1',
  'brand-5': '#594b5e',
}

RGB Array

[180, 192, 26], [81, 197, 177], [213, 142, 49], [149, 91, 177], [89, 75, 94]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B4C01A, #51C5B1, #D58E31, #955BB1, #594B5E 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: #b4c01a; --color-2: #51c5b1; --color-3: #d58e31; --color-4: #955bb1; --color-5: #594b5e. 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