#B4B691 + #629B95 + #387F93 + #385294 + #4C3894 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B4B691

Fresh Green · DarkGray · Sunflower

HEX

#B4B691

RGB

rgb(180, 182, 145)

HSL

hsl(63, 20%, 64%)

HSB

hsb(63, 20%, 71%)

CMYK

cmyk(1%, 0%, 20%, 29%)

Oklch

oklch(76.5% 0.051 110.1)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

#629B95

Mineral Blue · CadetBlue · Mint Ice

HEX

#629B95

RGB

rgb(98, 155, 149)

HSL

hsl(174, 23%, 50%)

HSB

hsb(174, 37%, 61%)

CMYK

cmyk(37%, 0%, 4%, 39%)

Oklch

oklch(64.8% 0.061 187.4)

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

#387F93

Slate Blue · SteelBlue · Mint Ice

HEX

#387F93

RGB

rgb(56, 127, 147)

HSL

hsl(193, 45%, 40%)

HSB

hsb(193, 62%, 58%)

CMYK

cmyk(62%, 14%, 0%, 42%)

Oklch

oklch(56.0% 0.077 219.2)

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

#385294

Indigo · DarkSlateBlue · Prussian Blue

HEX

#385294

RGB

rgb(56, 82, 148)

HSL

hsl(223, 45%, 40%)

HSB

hsb(223, 62%, 58%)

CMYK

cmyk(62%, 45%, 0%, 42%)

Oklch

oklch(45.2% 0.112 265.9)

Traditional「Indigo」· Paint「Prussian Blue」· Creative Blush Sunrise

#4C3894

Deep Indigo · DarkSlateBlue · Prussian Blue

HEX

#4C3894

RGB

rgb(76, 56, 148)

HSL

hsl(253, 45%, 40%)

HSB

hsb(253, 62%, 58%)

CMYK

cmyk(49%, 62%, 0%, 42%)

Oklch

oklch(41.6% 0.144 288.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B4B691

9391B6

Analogous

B6A591

B4B691

A1B691

Triadic

B4B691

91B4B6

B691B4

Split-Comp.

B4B691

91A1B6

A591B6

Tetradic

B4B691

91B6A5

9391B6

B691A1

Contrast Matrix WCAG 2.1 Contrast

B4B691	629B95	387F93	385294	4C3894
—	1.5 Fail	2.2 Fail	3.6 AA Large	4.4 AA Large
1.5 Fail	—	1.4 Fail	2.4 Fail	2.9 Fail
2.2 Fail	1.4 Fail	—	1.7 Fail	2.0 Fail
3.6 AA Large	2.4 Fail	1.7 Fail	—	1.2 Fail
4.4 AA Large	2.9 Fail	2.0 Fail	1.2 Fail	—

White BG

2.1Fail

3.2AA Large

4.5AA

7.5AAA

9.1AAA

Black BG

10.0AAA

6.6AA

4.6AA

2.8Fail

2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B59A

7B7B96

57578E

434384

43437E

Deuteranopia

B5B59C

777397

534D8D

424080

454678

Tritanopia

B4A1A3

659898

3C8A8A

397775

4B6C68

Achromatopsia

B1B1B1

898989

6C6C6C

525252

484848

Shades & Tints Shades & Tints

#B4B691

Dark

Light

#629B95

Dark

Light

#387F93

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b4b691;
  --color-2: #629b95;
  --color-3: #387f93;
  --color-4: #385294;
  --color-5: #4c3894;
}

SCSS

$color-1: #b4b691;
$color-2: #629b95;
$color-3: #387f93;
$color-4: #385294;
$color-5: #4c3894;

TAILWIND

colors: {
  'brand-1': '#b4b691',
  'brand-2': '#629b95',
  'brand-3': '#387f93',
  'brand-4': '#385294',
  'brand-5': '#4c3894',
}

RGB Array

[180, 182, 145], [98, 155, 149], [56, 127, 147], [56, 82, 148], [76, 56, 148]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B4B691, #629B95, #387F93, #385294, #4C3894 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: #b4b691; --color-2: #629b95; --color-3: #387f93; --color-4: #385294; --color-5: #4c3894. 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