#C64F34 + #D62D2D + #B82138 + #701934 + #382634 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#C64F34

Crimson · Chocolate · Passion Red

HEX

#C64F34

RGB

rgb(198, 79, 52)

HSL

hsl(11, 58%, 49%)

HSB

hsb(11, 74%, 78%)

CMYK

cmyk(0%, 60%, 74%, 22%)

Oklch

oklch(58.0% 0.158 34.2)

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

#D62D2D

Vermilion · Crimson · Passion Red

HEX

#D62D2D

RGB

rgb(214, 45, 45)

HSL

hsl(0, 67%, 51%)

HSB

hsb(0, 79%, 84%)

CMYK

cmyk(0%, 79%, 79%, 16%)

Oklch

oklch(57.2% 0.205 26.6)

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

#B82138

Vermilion · FireBrick · Passion Red

HEX

#B82138

RGB

rgb(184, 33, 56)

HSL

hsl(351, 70%, 43%)

HSB

hsb(351, 82%, 72%)

CMYK

cmyk(0%, 82%, 70%, 28%)

Oklch

oklch(51.0% 0.184 19.5)

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

#701934

Dark Violet · Brown · Camellia

HEX

#701934

RGB

rgb(112, 25, 52)

HSL

hsl(341, 64%, 27%)

HSB

hsb(341, 78%, 44%)

CMYK

cmyk(0%, 78%, 54%, 56%)

Oklch

oklch(36.8% 0.121 7.1)

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

#382634

Rose Purple · DarkSlateGray · Dark Purple

HEX

#382634

RGB

rgb(56, 38, 52)

HSL

hsl(313, 19%, 18%)

HSB

hsb(313, 32%, 22%)

CMYK

cmyk(0%, 32%, 7%, 78%)

Oklch

oklch(29.6% 0.036 334.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C64F34

34ABC5

Analogous

C53462

C64F34

C59834

Triadic

C64F34

34C54F

4F34C5

Split-Comp.

C64F34

34C598

3462C5

Tetradic

C64F34

62C534

34ABC5

9834C5

Contrast Matrix WCAG 2.1 Contrast

C64F34	D62D2D	B82138	701934	382634
—	1.1 Fail	1.4 Fail	2.4 Fail	3.1 AA Large
1.1 Fail	—	1.3 Fail	2.3 Fail	2.9 Fail
1.4 Fail	1.3 Fail	—	1.8 Fail	2.2 Fail
2.4 Fail	2.3 Fail	1.8 Fail	—	1.3 Fail
3.1 AA Large	2.9 Fail	2.2 Fail	1.3 Fail	—

White BG

4.6AA

4.9AA

6.3AA

11.2AAA

14.0AAA

Black BG

4.6AA

4.3AA Large

3.3AA Large

1.9Fail

1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

92913B

8D8B2D

777532

4A4A2D

303031

Deuteranopia

99A23C

97A32D

7F8B31

4F562C

313330

Tritanopia

C04041

CE2D2D

B02E2D

6C2827

372E2D

Achromatopsia

707070

606060

515151

363636

2D2D2D

Shades & Tints Shades & Tints

#C64F34

Dark

Light

#D62D2D

Dark

Light

#B82138

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c64f34;
  --color-2: #d62d2d;
  --color-3: #b82138;
  --color-4: #701934;
  --color-5: #382634;
}

SCSS

$color-1: #c64f34;
$color-2: #d62d2d;
$color-3: #b82138;
$color-4: #701934;
$color-5: #382634;

TAILWIND

colors: {
  'brand-1': '#c64f34',
  'brand-2': '#d62d2d',
  'brand-3': '#b82138',
  'brand-4': '#701934',
  'brand-5': '#382634',
}

RGB Array

[198, 79, 52], [214, 45, 45], [184, 33, 56], [112, 25, 52], [56, 38, 52]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C64F34, #D62D2D, #B82138, #701934, #382634 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: #c64f34; --color-2: #d62d2d; --color-3: #b82138; --color-4: #701934; --color-5: #382634. 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