← Back to Editor

#DB1F3E · #C62B44 · #B03348 · #953746 · #7D3844

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#DB1F3E

Vermilion · Crimson · Passion Red

HEX
#DB1F3E
RGB
rgb(219, 31, 62)
HSL
hsl(350, 75%, 49%)
HSB
hsb(350, 86%, 86%)
CMYK
cmyk(0%, 86%, 72%, 14%)
Oklch
oklch(57.4% 0.216 20.3)

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

#C62B44

Vermilion · Crimson · Passion Red

HEX
#C62B44
RGB
rgb(198, 43, 68)
HSL
hsl(350, 64%, 47%)
HSB
hsb(350, 78%, 78%)
CMYK
cmyk(0%, 78%, 66%, 22%)
Oklch
oklch(54.5% 0.189 18.0)

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

#B03348

Crimson · Brown · Passion Red

HEX
#B03348
RGB
rgb(176, 51, 72)
HSL
hsl(350, 55%, 45%)
HSB
hsb(350, 71%, 69%)
CMYK
cmyk(0%, 71%, 59%, 31%)
Oklch
oklch(51.4% 0.161 15.3)

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

#953746

Crimson · Brown · Wine Red

HEX
#953746
RGB
rgb(149, 55, 70)
HSL
hsl(350, 46%, 40%)
HSB
hsb(350, 63%, 58%)
CMYK
cmyk(0%, 63%, 53%, 42%)
Oklch
oklch(47.3% 0.127 13.8)

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

#7D3844

Crimson · Sienna · Wine Red

HEX
#7D3844
RGB
rgb(125, 56, 68)
HSL
hsl(350, 38%, 35%)
HSB
hsb(350, 55%, 49%)
CMYK
cmyk(0%, 55%, 46%, 51%)
Oklch
oklch(43.6% 0.096 11.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

DB1F3E
1FDBBB

Analogous

DB1F9C
DB1F3E
DB5E1F

Triadic

DB1F3E
3EDB1F
1F3EDB

Split-Comp.

DB1F3E
1FDB5E
1F9CDB

Tetradic

DB1F3E
9CDB1F
1FDBBB
5E1FDB

Contrast Matrix WCAG 2.1 Contrast

DB1F3E
C62B44
B03348
953746
7D3844
—
1.1
Fail
1.3
Fail
1.5
Fail
1.7
Fail
1.1
Fail
—
1.1
Fail
1.3
Fail
1.5
Fail
1.3
Fail
1.1
Fail
—
1.2
Fail
1.4
Fail
1.5
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
1.7
Fail
1.5
Fail
1.4
Fail
1.2
Fail
—
White BG
4.9AA
5.5AA
6.2AA
7.2AAA
8.3AAA
Black BG
4.3AA Large
3.8AA Large
3.4AA Large
2.9Fail
2.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

8A8836
83813E
7A7943
6C6B42
5F5F41

Deuteranopia

95A335
8C983C
818B42
727942
636840

Tritanopia

D2312F
BE3938
AA3F3E
90403F
7A3F3E

Achromatopsia

5B5B5B
5C5C5C
5B5B5B
555555
4E4E4E

Shades & Tints Shades & Tints

#DB1F3E

Dark
Light

#C62B44

Dark
Light

#B03348

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #db1f3e;
  --color-2: #c62b44;
  --color-3: #b03348;
  --color-4: #953746;
  --color-5: #7d3844;
}

SCSS

$color-1: #db1f3e;
$color-2: #c62b44;
$color-3: #b03348;
$color-4: #953746;
$color-5: #7d3844;

TAILWIND

colors: {
  'brand-1': '#db1f3e',
  'brand-2': '#c62b44',
  'brand-3': '#b03348',
  'brand-4': '#953746',
  'brand-5': '#7d3844',
}

RGB Array

[219, 31, 62], [198, 43, 68], [176, 51, 72], [149, 55, 70], [125, 56, 68]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #DB1F3E, #C62B44, #B03348, #953746, #7D3844 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: #db1f3e; --color-2: #c62b44; --color-3: #b03348; --color-4: #953746; --color-5: #7d3844. 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