#4F3B3A + #D1143E + #DE4768 + #D18091 + #80D1BF · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#4F3B3A

Crimson · DarkSlateGray · Wine Red

HEX

#4F3B3A

RGB

rgb(79, 59, 58)

HSL

hsl(3, 15%, 27%)

HSB

hsb(3, 27%, 31%)

CMYK

cmyk(0%, 25%, 27%, 69%)

Oklch

oklch(37.4% 0.028 21.8)

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

#D1143E

Vermilion · Crimson · Passion Red

HEX

#D1143E

RGB

rgb(209, 20, 62)

HSL

hsl(347, 83%, 45%)

HSB

hsb(347, 90%, 82%)

CMYK

cmyk(0%, 90%, 70%, 18%)

Oklch

oklch(55.1% 0.213 18.5)

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

#DE4768

Vermilion · Tomato · Passion Red

HEX

#DE4768

RGB

rgb(222, 71, 104)

HSL

hsl(347, 70%, 57%)

HSB

hsb(347, 68%, 87%)

CMYK

cmyk(0%, 68%, 53%, 13%)

Oklch

oklch(61.9% 0.187 11.6)

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

#D18091

Peach Pink · LightCoral · Coral Red

HEX

#D18091

RGB

rgb(209, 128, 145)

HSL

hsl(347, 47%, 66%)

HSB

hsb(347, 39%, 82%)

CMYK

cmyk(0%, 39%, 31%, 18%)

Oklch

oklch(69.0% 0.102 6.5)

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

#80D1BF

Jade · MediumAquaMarine · Lake Green

HEX

#80D1BF

RGB

rgb(128, 209, 191)

HSL

hsl(167, 47%, 66%)

HSB

hsb(167, 39%, 82%)

CMYK

cmyk(39%, 0%, 9%, 18%)

Oklch

oklch(80.3% 0.084 178.3)

Traditional「Jade」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

4F3B3A

3B4E4F

Analogous

4F3B44

4F3B3A

4F463B

Triadic

4F3B3A

3B4F3C

3C3B4F

Split-Comp.

4F3B3A

3B4F46

3B444F

Tetradic

4F3B3A

444F3B

3B4E4F

463B4F

Contrast Matrix WCAG 2.1 Contrast

4F3B3A	D1143E	DE4768	D18091	80D1BF
—	1.9 Fail	2.6 Fail	3.6 AA Large	5.8 AA
1.9 Fail	—	1.3 Fail	1.9 Fail	3.0 AA Large
2.6 Fail	1.3 Fail	—	1.4 Fail	2.3 Fail
3.6 AA Large	1.9 Fail	1.4 Fail	—	1.6 Fail
5.8 AA	3.0 AA Large	2.3 Fail	1.6 Fail	—

White BG

10.4AAA

5.4AA

4.0AA Large

2.9Fail

1.8Fail

Black BG

2.0Fail

3.9AA Large

5.2AA

7.2AAA

11.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

46463A

7F7D34

9D9B60

AEAD8D

A3A4C3

Deuteranopia

48493A

8A9831

A5B15E

B3B98C

9E98C4

Tritanopia

4E3A3A

C82C2A

D65A58

CD8A89

84C7C8

Achromatopsia

414141

515151

787878

9A9A9A

B7B7B7

Shades & Tints Shades & Tints

#4F3B3A

Dark

Light

#D1143E

Dark

Light

#DE4768

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #4f3b3a;
  --color-2: #d1143e;
  --color-3: #de4768;
  --color-4: #d18091;
  --color-5: #80d1bf;
}

SCSS

$color-1: #4f3b3a;
$color-2: #d1143e;
$color-3: #de4768;
$color-4: #d18091;
$color-5: #80d1bf;

TAILWIND

colors: {
  'brand-1': '#4f3b3a',
  'brand-2': '#d1143e',
  'brand-3': '#de4768',
  'brand-4': '#d18091',
  'brand-5': '#80d1bf',
}

RGB Array

[79, 59, 58], [209, 20, 62], [222, 71, 104], [209, 128, 145], [128, 209, 191]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #4F3B3A, #D1143E, #DE4768, #D18091, #80D1BF 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: #4f3b3a; --color-2: #d1143e; --color-3: #de4768; --color-4: #d18091; --color-5: #80d1bf. 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 dark-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