#4B4867 + #DAC596 + #A8B692 + #C45D6E + #BA2954 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#4B4867

Deep Indigo · DarkSlateGray · Prussian Blue

HEX

#4B4867

RGB

rgb(75, 72, 103)

HSL

hsl(246, 18%, 34%)

HSB

hsb(246, 30%, 40%)

CMYK

cmyk(27%, 30%, 0%, 60%)

Oklch

oklch(41.8% 0.051 288.4)

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

#DAC596

Goose Yellow · BurlyWood · Sunflower

HEX

#DAC596

RGB

rgb(218, 197, 150)

HSL

hsl(41, 48%, 72%)

HSB

hsb(41, 31%, 85%)

CMYK

cmyk(0%, 10%, 31%, 15%)

Oklch

oklch(83.0% 0.066 86.7)

Traditional「Goose Yellow」· Paint「Sunflower」· Creative Lemon Fizz

#A8B692

Willow Green · DarkSeaGreen · Apple Green

HEX

#A8B692

RGB

rgb(168, 182, 146)

HSL

hsl(83, 20%, 64%)

HSB

hsb(83, 20%, 71%)

CMYK

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

Oklch

oklch(75.6% 0.052 124.9)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#C45D6E

Crimson · LightCoral · Passion Red

HEX

#C45D6E

RGB

rgb(196, 93, 110)

HSL

hsl(350, 47%, 57%)

HSB

hsb(350, 53%, 77%)

CMYK

cmyk(0%, 53%, 44%, 23%)

Oklch

oklch(60.8% 0.132 11.5)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#BA2954

Dark Violet · Crimson · Camellia

HEX

#BA2954

RGB

rgb(186, 41, 84)

HSL

hsl(342, 64%, 45%)

HSB

hsb(342, 78%, 73%)

CMYK

cmyk(0%, 78%, 55%, 27%)

Oklch

oklch(52.6% 0.181 9.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4B4867

636647

Analogous

475466

4B4867

5A4766

Triadic

4B4867

664A47

47664A

Split-Comp.

4B4867

665A47

546647

Tetradic

4B4867

664754

636647

47665A

Contrast Matrix WCAG 2.1 Contrast

4B4867	DAC596	A8B692	C45D6E	BA2954
—	5.1 AA	4.0 AA Large	2.1 Fail	1.5 Fail
5.1 AA	—	1.3 Fail	2.4 Fail	3.5 AA Large
4.0 AA Large	1.3 Fail	—	1.9 Fail	2.8 Fail
2.1 Fail	2.4 Fail	1.9 Fail	—	1.5 Fail
1.5 Fail	3.5 AA Large	2.8 Fail	1.5 Fail	—

White BG

8.7AAA

1.7Fail

2.1Fail

4.1AA Large

5.9AA

Black BG

2.4Fail

12.4AAA

9.8AAA

5.1AA

3.5AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

4A4A5F

D1D1A1

AEAE9B

97966A

7B7A4A

Deuteranopia

4A4A5E

D2D4A4

ADAC9D

9DA569

848F47

Tritanopia

4B5A58

D9AAAC

A9A2A3

BF6766

B34140

Achromatopsia

4C4C4C

C6C6C6

AEAEAE

7E7E7E

595959

Shades & Tints Shades & Tints

#4B4867

Dark

Light

#DAC596

Dark

Light

#A8B692

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4b4867;
  --color-2: #dac596;
  --color-3: #a8b692;
  --color-4: #c45d6e;
  --color-5: #ba2954;
}

SCSS

$color-1: #4b4867;
$color-2: #dac596;
$color-3: #a8b692;
$color-4: #c45d6e;
$color-5: #ba2954;

TAILWIND

colors: {
  'brand-1': '#4b4867',
  'brand-2': '#dac596',
  'brand-3': '#a8b692',
  'brand-4': '#c45d6e',
  'brand-5': '#ba2954',
}

RGB Array

[75, 72, 103], [218, 197, 150], [168, 182, 146], [196, 93, 110], [186, 41, 84]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #4B4867, #DAC596, #A8B692, #C45D6E, #BA2954 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: #4b4867; --color-2: #dac596; --color-3: #a8b692; --color-4: #c45d6e; --color-5: #ba2954. 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