#5D434C + #E85158 + #D4938F + #B5A6A3 + #61A598 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#5D434C

Dark Violet · DarkSlateGray · Camellia

HEX

#5D434C

RGB

rgb(93, 67, 76)

HSL

hsl(339, 16%, 31%)

HSB

hsb(339, 28%, 36%)

CMYK

cmyk(0%, 28%, 18%, 64%)

Oklch

oklch(41.4% 0.038 356.3)

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

#E85158

Peach Pink · Tomato · Coral Red

HEX

#E85158

RGB

rgb(232, 81, 88)

HSL

hsl(357, 77%, 61%)

HSB

hsb(357, 65%, 91%)

CMYK

cmyk(0%, 65%, 62%, 9%)

Oklch

oklch(64.2% 0.186 21.5)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

#D4938F

Peach Pink · DarkSalmon · Coral Red

HEX

#D4938F

RGB

rgb(212, 147, 143)

HSL

hsl(3, 45%, 70%)

HSB

hsb(3, 33%, 83%)

CMYK

cmyk(0%, 31%, 33%, 17%)

Oklch

oklch(72.6% 0.079 23.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#B5A6A3

Peach Pink · DarkGray · Coral Red

HEX

#B5A6A3

RGB

rgb(181, 166, 163)

HSL

hsl(10, 11%, 67%)

HSB

hsb(10, 10%, 71%)

CMYK

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

Oklch

oklch(73.7% 0.018 31.1)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#61A598

Mineral Blue · CadetBlue · Lake Green

HEX

#61A598

RGB

rgb(97, 165, 152)

HSL

hsl(169, 27%, 51%)

HSB

hsb(169, 41%, 65%)

CMYK

cmyk(41%, 0%, 8%, 35%)

Oklch

oklch(67.3% 0.072 180.4)

Traditional「Mineral Blue」· Paint「Lake Green」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

5D434C

425C53

Analogous

5C4258

5D434C

5C4642

Triadic

5D434C

4B5C42

424B5C

Split-Comp.

5D434C

425C46

42585C

Tetradic

5D434C

585C42

425C53

46425C

Contrast Matrix WCAG 2.1 Contrast

5D434C	E85158	D4938F	B5A6A3	61A598
—	2.4 Fail	3.5 AA Large	3.8 AA Large	3.1 AA Large
2.4 Fail	—	1.5 Fail	1.6 Fail	1.3 Fail
3.5 AA Large	1.5 Fail	—	1.1 Fail	1.1 Fail
3.8 AA Large	1.6 Fail	1.1 Fail	—	1.2 Fail
3.1 AA Large	1.3 Fail	1.1 Fail	1.2 Fail	—

White BG

8.9AAA

3.7AA Large

2.5Fail

2.3Fail

2.9Fail

Black BG

2.4Fail

5.7AA

8.4AAA

8.9AAA

7.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

52524A

A7A556

B8B790

AFAEA4

7E7F9B

Deuteranopia

535549

AFBB56

BCC090

AFB1A4

7B759C

Tritanopia

5C4848

E05555

D19191

B4A4A4

649E9E

Achromatopsia

4C4C4C

7F7F7F

A6A6A6

AAAAAA

8F8F8F

Shades & Tints Shades & Tints

#5D434C

Dark

Light

#E85158

Dark

Light

#D4938F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #5d434c;
  --color-2: #e85158;
  --color-3: #d4938f;
  --color-4: #b5a6a3;
  --color-5: #61a598;
}

SCSS

$color-1: #5d434c;
$color-2: #e85158;
$color-3: #d4938f;
$color-4: #b5a6a3;
$color-5: #61a598;

TAILWIND

colors: {
  'brand-1': '#5d434c',
  'brand-2': '#e85158',
  'brand-3': '#d4938f',
  'brand-4': '#b5a6a3',
  'brand-5': '#61a598',
}

RGB Array

[93, 67, 76], [232, 81, 88], [212, 147, 143], [181, 166, 163], [97, 165, 152]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #5D434C, #E85158, #D4938F, #B5A6A3, #61A598 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: #5d434c; --color-2: #e85158; --color-3: #d4938f; --color-4: #b5a6a3; --color-5: #61a598. 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