#B84858 + #92386C + #693259 + #532541 + #3C1528 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#B84858

Crimson · Sienna · Passion Red

HEX

#B84858

RGB

rgb(184, 72, 88)

HSL

hsl(351, 44%, 50%)

HSB

hsb(351, 61%, 72%)

CMYK

cmyk(0%, 61%, 52%, 28%)

Oklch

oklch(55.6% 0.145 14.5)

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

#92386C

Rose Purple · Purple · Camellia

HEX

#92386C

RGB

rgb(146, 56, 108)

HSL

hsl(325, 45%, 40%)

HSB

hsb(325, 62%, 57%)

CMYK

cmyk(0%, 62%, 26%, 43%)

Oklch

oklch(48.2% 0.135 347.6)

Traditional「Rose Purple」· Paint「Camellia」· Creative Blush Sunrise

#693259

Rose Purple · DimGray · Eggplant

HEX

#693259

RGB

rgb(105, 50, 89)

HSL

hsl(317, 35%, 30%)

HSB

hsb(317, 52%, 41%)

CMYK

cmyk(0%, 52%, 15%, 59%)

Oklch

oklch(40.4% 0.094 339.5)

Traditional「Rose Purple」· Paint「Eggplant」· Creative Blush Sunrise

#532541

Rose Purple · DarkSlateGray · Raspberry

HEX

#532541

RGB

rgb(83, 37, 65)

HSL

hsl(323, 38%, 24%)

HSB

hsb(323, 55%, 33%)

CMYK

cmyk(0%, 55%, 22%, 67%)

Oklch

oklch(33.9% 0.078 344.7)

Traditional「Rose Purple」· Paint「Raspberry」· Creative Blush Sunrise

#3C1528

Dark Violet · DarkSlateGray · Raspberry

HEX

#3C1528

RGB

rgb(60, 21, 40)

HSL

hsl(331, 48%, 16%)

HSB

hsb(331, 65%, 24%)

CMYK

cmyk(0%, 65%, 33%, 76%)

Oklch

oklch(26.3% 0.066 352.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B84858

47B8A7

Analogous

B84790

B84858

B86F47

Triadic

B84858

58B847

4758B8

Split-Comp.

B84858

47B86F

4790B8

Tetradic

B84858

90B847

47B8A7

6F47B8

Contrast Matrix WCAG 2.1 Contrast

B84858	92386C	693259	532541	3C1528
—	1.4 Fail	1.9 Fail	2.4 Fail	3.1 AA Large
1.4 Fail	—	1.4 Fail	1.8 Fail	2.3 Fail
1.9 Fail	1.4 Fail	—	1.3 Fail	1.7 Fail
2.4 Fail	1.8 Fail	1.3 Fail	—	1.3 Fail
3.1 AA Large	2.3 Fail	1.7 Fail	1.3 Fail	—

White BG

5.1AA

7.0AA

9.5AAA

12.3AAA

15.8AAA

Black BG

4.1AA Large

3.0AA Large

2.2Fail

1.7Fail

1.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

888654

6B6A5F

515150

3F3F3A

2B2B23

Deuteranopia

8E9653

70775C

54594D

424539

2D3022

Tritanopia

B25150

8E5553

664846

513534

3A201F

Achromatopsia

6B6B6B

595959

474747

363636

232323

Shades & Tints Shades & Tints

#B84858

Dark

Light

#92386C

Dark

Light

#693259

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b84858;
  --color-2: #92386c;
  --color-3: #693259;
  --color-4: #532541;
  --color-5: #3c1528;
}

SCSS

$color-1: #b84858;
$color-2: #92386c;
$color-3: #693259;
$color-4: #532541;
$color-5: #3c1528;

TAILWIND

colors: {
  'brand-1': '#b84858',
  'brand-2': '#92386c',
  'brand-3': '#693259',
  'brand-4': '#532541',
  'brand-5': '#3c1528',
}

RGB Array

[184, 72, 88], [146, 56, 108], [105, 50, 89], [83, 37, 65], [60, 21, 40]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B84858, #92386C, #693259, #532541, #3C1528 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: #b84858; --color-2: #92386c; --color-3: #693259; --color-4: #532541; --color-5: #3c1528. 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