#BD2A4E + #654B6B + #628179 + #2C3845 + #899738 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#BD2A4E

Vermilion · Crimson · Passion Red

HEX

#BD2A4E

RGB

rgb(189, 42, 78)

HSL

hsl(345, 64%, 45%)

HSB

hsb(345, 78%, 74%)

CMYK

cmyk(0%, 78%, 59%, 26%)

Oklch

oklch(53.0% 0.182 12.5)

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

#654B6B

Dark Plum · DimGray · Eggplant

HEX

#654B6B

RGB

rgb(101, 75, 107)

HSL

hsl(289, 18%, 36%)

HSB

hsb(289, 30%, 42%)

CMYK

cmyk(6%, 30%, 0%, 58%)

Oklch

oklch(45.3% 0.060 319.9)

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

#628179

Mineral Blue · SlateGray · Mint Ice

HEX

#628179

RGB

rgb(98, 129, 121)

HSL

hsl(165, 14%, 45%)

HSB

hsb(165, 24%, 51%)

CMYK

cmyk(24%, 0%, 6%, 49%)

Oklch

oklch(57.7% 0.037 177.3)

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

#2C3845

Indigo · DarkSlateGray · Prussian Blue

HEX

#2C3845

RGB

rgb(44, 56, 69)

HSL

hsl(211, 22%, 22%)

HSB

hsb(211, 36%, 27%)

CMYK

cmyk(36%, 19%, 0%, 73%)

Oklch

oklch(33.5% 0.028 250.7)

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

#899738

Autumn Sage · Olive · Honey Gold

HEX

#899738

RGB

rgb(137, 151, 56)

HSL

hsl(69, 46%, 41%)

HSB

hsb(69, 63%, 59%)

CMYK

cmyk(9%, 0%, 63%, 41%)

Oklch

oklch(64.6% 0.121 117.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BD2A4E

29BC97

Analogous

BC2997

BD2A4E

BC4E29

Triadic

BD2A4E

4EBC29

294EBC

Split-Comp.

BD2A4E

29BC4E

2997BC

Tetradic

BD2A4E

97BC29

29BC97

4E29BC

Contrast Matrix WCAG 2.1 Contrast

BD2A4E	654B6B	628179	2C3845	899738
—	1.3 Fail	1.4 Fail	2.0 Fail	1.8 Fail
1.3 Fail	—	1.8 Fail	1.6 Fail	2.4 Fail
1.4 Fail	1.8 Fail	—	2.8 Fail	1.3 Fail
2.0 Fail	1.6 Fail	2.8 Fail	—	3.7 AA Large
1.8 Fail	2.4 Fail	1.3 Fail	3.7 AA Large	—

White BG

5.8AA

7.6AAA

4.3AA Large

11.9AAA

3.2AA Large

Black BG

3.6AA Large

2.8Fail

4.9AA

1.8Fail

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7D7C45

5A5A63

6F707B

313142

8F8F4F

Deuteranopia

869143

5B5D61

6E6B7B

313041

8E8D55

Tritanopia

B63E3D

645D5C

647C7D

2D3F3F

8A6165

Achromatopsia

5A5A5A

565656

777777

363636

888888

Shades & Tints Shades & Tints

#BD2A4E

Dark

Light

#654B6B

Dark

Light

#628179

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #bd2a4e;
  --color-2: #654b6b;
  --color-3: #628179;
  --color-4: #2c3845;
  --color-5: #899738;
}

SCSS

$color-1: #bd2a4e;
$color-2: #654b6b;
$color-3: #628179;
$color-4: #2c3845;
$color-5: #899738;

TAILWIND

colors: {
  'brand-1': '#bd2a4e',
  'brand-2': '#654b6b',
  'brand-3': '#628179',
  'brand-4': '#2c3845',
  'brand-5': '#899738',
}

RGB Array

[189, 42, 78], [101, 75, 107], [98, 129, 121], [44, 56, 69], [137, 151, 56]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BD2A4E, #654B6B, #628179, #2C3845, #899738 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: #bd2a4e; --color-2: #654b6b; --color-3: #628179; --color-4: #2c3845; --color-5: #899738. 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