#571E35 + #702636 + #8A2F38 + #A33D37 + #BD5540 · pastel - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

GentleSoothingSweetWarm

Industry INDUSTRY

Kids & BabyBeautyLifestyle

UI Context UI CONTEXT

E-commerceSocial PostIllustration

Color Details Color Details

#571E35

Dark Violet · DarkSlateGray · Raspberry

HEX

#571E35

RGB

rgb(87, 30, 53)

HSL

hsl(336, 49%, 23%)

HSB

hsb(336, 66%, 34%)

CMYK

cmyk(0%, 66%, 39%, 66%)

Oklch

oklch(32.9% 0.088 358.0)

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

#702636

Crimson · Brown · Wine Red

HEX

#702636

RGB

rgb(112, 38, 54)

HSL

hsl(347, 49%, 29%)

HSB

hsb(347, 66%, 44%)

CMYK

cmyk(0%, 66%, 52%, 56%)

Oklch

oklch(38.4% 0.105 10.4)

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

#8A2F38

Crimson · Brown · Wine Red

HEX

#8A2F38

RGB

rgb(138, 47, 56)

HSL

hsl(354, 49%, 36%)

HSB

hsb(354, 66%, 54%)

CMYK

cmyk(0%, 66%, 59%, 46%)

Oklch

oklch(44.1% 0.124 18.0)

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

#A33D37

Crimson · Brown · Passion Red

HEX

#A33D37

RGB

rgb(163, 61, 55)

HSL

hsl(3, 50%, 43%)

HSB

hsb(3, 66%, 64%)

CMYK

cmyk(0%, 63%, 66%, 36%)

Oklch

oklch(50.1% 0.137 26.5)

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

#BD5540

Crimson · Sienna · Passion Red

HEX

#BD5540

RGB

rgb(189, 85, 64)

HSL

hsl(10, 49%, 50%)

HSB

hsb(10, 66%, 74%)

CMYK

cmyk(0%, 55%, 66%, 26%)

Oklch

oklch(57.7% 0.139 33.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

571E35

1E5740

Analogous

571E52

571E35

57241E

Triadic

571E35

35571E

1E3557

Split-Comp.

571E35

1E5724

1E5257

Tetradic

571E35

52571E

1E5740

241E57

Contrast Matrix WCAG 2.1 Contrast

571E35	702636	8A2F38	A33D37	BD5540
—	1.2 Fail	1.5 Fail	2.0 Fail	2.8 Fail
1.2 Fail	—	1.3 Fail	1.6 Fail	2.2 Fail
1.5 Fail	1.3 Fail	—	1.3 Fail	1.8 Fail
2.0 Fail	1.6 Fail	1.3 Fail	—	1.4 Fail
2.8 Fail	2.2 Fail	1.8 Fail	1.4 Fail	—

White BG

12.8AAA

10.4AAA

8.3AAA

6.4AA

4.6AA

Black BG

1.6Fail

2.0Fail

2.5Fail

3.3AA Large

4.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

3E3E2F

504F32

636236

777638

908F45

Deuteranopia

42462E

545A31

686F35

7D8439

969E46

Tritanopia

542B2A

6C2F2E

853434

9E3A3A

B8494A

Achromatopsia

323232

3E3E3E

4B4B4B

5B5B5B

727272

Shades & Tints Shades & Tints

#571E35

Dark

Light

#702636

Dark

Light

#8A2F38

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #571e35;
  --color-2: #702636;
  --color-3: #8a2f38;
  --color-4: #a33d37;
  --color-5: #bd5540;
}

SCSS

$color-1: #571e35;
$color-2: #702636;
$color-3: #8a2f38;
$color-4: #a33d37;
$color-5: #bd5540;

TAILWIND

colors: {
  'brand-1': '#571e35',
  'brand-2': '#702636',
  'brand-3': '#8a2f38',
  'brand-4': '#a33d37',
  'brand-5': '#bd5540',
}

RGB Array

[87, 30, 53], [112, 38, 54], [138, 47, 56], [163, 61, 55], [189, 85, 64]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This pastel-style palette of #571E35, #702636, #8A2F38, #A33D37, #BD5540 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: #571e35; --color-2: #702636; --color-3: #8a2f38; --color-4: #a33d37; --color-5: #bd5540. 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 pastel-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