#B3B351 + #360B01 + #869154 + #59968B + #1E9AC7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B3B351

Autumn Sage · GoldenRod · Sunflower

HEX

#B3B351

RGB

rgb(179, 179, 81)

HSL

hsl(60, 39%, 51%)

HSB

hsb(60, 55%, 70%)

CMYK

cmyk(0%, 0%, 55%, 30%)

Oklch

oklch(74.7% 0.121 109.0)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#360B01

Vermilion · Black · Deep Berry

HEX

#360B01

RGB

rgb(54, 11, 1)

HSL

hsl(11, 96%, 11%)

HSB

hsb(11, 98%, 21%)

CMYK

cmyk(0%, 80%, 98%, 79%)

Oklch

oklch(22.5% 0.072 37.4)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

#869154

Grass Green · Gray · Olive Green

HEX

#869154

RGB

rgb(134, 145, 84)

HSL

hsl(71, 27%, 45%)

HSB

hsb(71, 42%, 57%)

CMYK

cmyk(8%, 0%, 42%, 43%)

Oklch

oklch(63.3% 0.085 117.3)

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

#59968B

Mineral Blue · CadetBlue · Mint Ice

HEX

#59968B

RGB

rgb(89, 150, 139)

HSL

hsl(169, 26%, 47%)

HSB

hsb(169, 41%, 59%)

CMYK

cmyk(41%, 0%, 7%, 41%)

Oklch

oklch(62.8% 0.066 181.3)

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

#1E9AC7

Lake Blue · LightSeaGreen · Mint Ice

HEX

#1E9AC7

RGB

rgb(30, 154, 199)

HSL

hsl(196, 74%, 45%)

HSB

hsb(196, 85%, 78%)

CMYK

cmyk(85%, 23%, 0%, 22%)

Oklch

oklch(64.3% 0.120 229.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B3B351

5151B3

Analogous

B38251

B3B351

82B351

Triadic

B3B351

51B3B3

B351B3

Split-Comp.

B3B351

5182B3

8251B3

Tetradic

B3B351

51B382

5151B3

B35182

Contrast Matrix WCAG 2.1 Contrast

B3B351	360B01	869154	59968B	1E9AC7
—	7.9 AAA	1.5 Fail	1.5 Fail	1.5 Fail
7.9 AAA	—	5.1 AA	5.1 AA	5.4 AA
1.5 Fail	5.1 AA	—	1.0 Fail	1.1 Fail
1.5 Fail	5.1 AA	1.0 Fail	—	1.1 Fail
1.5 Fail	5.4 AA	1.1 Fail	1.1 Fail	—

White BG

2.2Fail

17.4AAA

3.4AA Large

3.2AA Large

Black BG

9.5AAA

1.2Fail

6.2AA

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B369

232303

8B8B63

73748E

5455BC

Deuteranopia

B3B36E

262904

8A8966

706B8E

4D43B9

Tritanopia

B37B80

340506

876E71

5C9090

24B4B2

Achromatopsia

A8A8A8

171717

878787

838383

7A7A7A

Shades & Tints Shades & Tints

#B3B351

Dark

Light

#360B01

Dark

Light

#869154

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b3b351;
  --color-2: #360b01;
  --color-3: #869154;
  --color-4: #59968b;
  --color-5: #1e9ac7;
}

SCSS

$color-1: #b3b351;
$color-2: #360b01;
$color-3: #869154;
$color-4: #59968b;
$color-5: #1e9ac7;

TAILWIND

colors: {
  'brand-1': '#b3b351',
  'brand-2': '#360b01',
  'brand-3': '#869154',
  'brand-4': '#59968b',
  'brand-5': '#1e9ac7',
}

RGB Array

[179, 179, 81], [54, 11, 1], [134, 145, 84], [89, 150, 139], [30, 154, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B3B351, #360B01, #869154, #59968B, #1E9AC7 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: #b3b351; --color-2: #360b01; --color-3: #869154; --color-4: #59968b; --color-5: #1e9ac7. 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