#B61A47 + #BA7A3D + #BABD24 + #DADC3D + #858F93 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B61A47

Dark Violet · Brown · Camellia

HEX

#B61A47

RGB

rgb(182, 26, 71)

HSL

hsl(343, 75%, 41%)

HSB

hsb(343, 86%, 71%)

CMYK

cmyk(0%, 86%, 61%, 29%)

Oklch

oklch(50.5% 0.187 12.2)

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

#BA7A3D

Tangerine · Chocolate · Amber Brown

HEX

#BA7A3D

RGB

rgb(186, 122, 61)

HSL

hsl(29, 51%, 48%)

HSB

hsb(29, 67%, 73%)

CMYK

cmyk(0%, 34%, 67%, 27%)

Oklch

oklch(63.5% 0.111 62.1)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#BABD24

Autumn Sage · GoldenRod · Honey Gold

HEX

#BABD24

RGB

rgb(186, 189, 36)

HSL

hsl(61, 68%, 44%)

HSB

hsb(61, 81%, 74%)

CMYK

cmyk(2%, 0%, 81%, 26%)

Oklch

oklch(77.1% 0.160 110.8)

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

#DADC3D

Autumn Sage · GreenYellow · Sunflower

HEX

#DADC3D

RGB

rgb(218, 220, 61)

HSL

hsl(61, 69%, 55%)

HSB

hsb(61, 72%, 86%)

CMYK

cmyk(1%, 0%, 72%, 14%)

Oklch

oklch(86.6% 0.171 110.2)

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

#858F93

Ash · LightSlateGray · Warm Gray

HEX

#858F93

RGB

rgb(133, 143, 147)

HSL

hsl(197, 6%, 55%)

HSB

hsb(197, 10%, 58%)

CMYK

cmyk(10%, 3%, 0%, 42%)

Oklch

oklch(64.3% 0.013 223.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B61A47

1AB78B

Analogous

B71A95

B61A47

B73C1A

Triadic

B61A47

47B71A

1A47B7

Split-Comp.

B61A47

1AB73C

1A95B7

Tetradic

B61A47

95B71A

1AB78B

3C1AB7

Contrast Matrix WCAG 2.1 Contrast

B61A47	BA7A3D	BABD24	DADC3D	858F93
—	1.8 Fail	3.2 AA Large	4.4 AA Large	2.0 Fail
1.8 Fail	—	1.7 Fail	2.4 Fail	1.1 Fail
3.2 AA Large	1.7 Fail	—	1.4 Fail	1.6 Fail
4.4 AA Large	2.4 Fail	1.4 Fail	—	2.3 Fail
2.0 Fail	1.1 Fail	1.6 Fail	2.3 Fail	—

White BG

6.5AA

3.5AA Large

2.0Fail

1.5Fail

3.3AA Large

Black BG

3.2AA Large

5.9AA

10.4AAA

14.3AAA

6.3AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

72713C

9E9E4C

BBBB49

DBDB63

898992

Deuteranopia

7C8739

A2A74F

BBBB52

DBDB6D

898892

Tritanopia

AE3432

B7575A

BA666D

DA8289

869191

Achromatopsia

4E4E4E

868686

ABABAB

C9C9C9

8C8C8C

Shades & Tints Shades & Tints

#B61A47

Dark

Light

#BA7A3D

Dark

Light

#BABD24

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b61a47;
  --color-2: #ba7a3d;
  --color-3: #babd24;
  --color-4: #dadc3d;
  --color-5: #858f93;
}

SCSS

$color-1: #b61a47;
$color-2: #ba7a3d;
$color-3: #babd24;
$color-4: #dadc3d;
$color-5: #858f93;

TAILWIND

colors: {
  'brand-1': '#b61a47',
  'brand-2': '#ba7a3d',
  'brand-3': '#babd24',
  'brand-4': '#dadc3d',
  'brand-5': '#858f93',
}

RGB Array

[182, 26, 71], [186, 122, 61], [186, 189, 36], [218, 220, 61], [133, 143, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B61A47, #BA7A3D, #BABD24, #DADC3D, #858F93 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: #b61a47; --color-2: #ba7a3d; --color-3: #babd24; --color-4: #dadc3d; --color-5: #858f93. 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