#78726E + #C44545 + #FF0000 + #94002A + #402830 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#78726E

Ink Gray · DimGray · Warm Gray

HEX

#78726E

RGB

rgb(120, 114, 110)

HSL

hsl(24, 4%, 45%)

HSB

hsb(24, 8%, 47%)

CMYK

cmyk(0%, 5%, 8%, 53%)

Oklch

oklch(55.6% 0.010 56.2)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#C44545

Crimson · Sienna · Passion Red

HEX

#C44545

RGB

rgb(196, 69, 69)

HSL

hsl(0, 52%, 52%)

HSB

hsb(0, 65%, 77%)

CMYK

cmyk(0%, 65%, 65%, 23%)

Oklch

oklch(56.7% 0.163 23.9)

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

#FF0000

Vermilion · Red · Passion Red

HEX

#FF0000

RGB

rgb(255, 0, 0)

HSL

hsl(0, 100%, 50%)

HSB

hsb(0, 100%, 100%)

CMYK

cmyk(0%, 100%, 100%, 0%)

Oklch

oklch(62.8% 0.258 29.2)

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

#94002A

Dark Violet · DarkRed · Camellia

HEX

#94002A

RGB

rgb(148, 0, 42)

HSL

hsl(343, 100%, 29%)

HSB

hsb(343, 100%, 58%)

CMYK

cmyk(0%, 100%, 72%, 42%)

Oklch

oklch(42.3% 0.169 17.1)

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

#402830

Dark Violet · DarkSlateGray · Raspberry

HEX

#402830

RGB

rgb(64, 40, 48)

HSL

hsl(340, 23%, 20%)

HSB

hsb(340, 38%, 25%)

CMYK

cmyk(0%, 38%, 25%, 75%)

Oklch

oklch(30.9% 0.038 357.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

78726E

6E7477

Analogous

776E6F

78726E

77766E

Triadic

78726E

6E7772

726E77

Split-Comp.

78726E

6E7776

6E6F77

Tetradic

78726E

6F776E

6E7477

766E77

Contrast Matrix WCAG 2.1 Contrast

78726E	C44545	FF0000	94002A	402830
—	1.0 Fail	1.2 Fail	1.9 Fail	2.8 Fail
1.0 Fail	—	1.2 Fail	1.9 Fail	2.7 Fail
1.2 Fail	1.2 Fail	—	2.3 Fail	3.4 AA Large
1.9 Fail	1.9 Fail	2.3 Fail	—	1.5 Fail
2.8 Fail	2.7 Fail	3.4 AA Large	1.5 Fail	—

White BG

4.7AA

4.9AA

4.0AA Large

9.2AAA

13.4AAA

Black BG

4.4AA Large

4.3AA Large

5.3AA

2.3Fail

1.6Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

75756F

8D8C45

918E00

545320

36352E

Deuteranopia

76766F

949E45

9FB300

5D681D

37392E

Tritanopia

787070

BE4545

F20000

8D1816

3F2D2C

Achromatopsia

737373

6B6B6B

4C4C4C

313131

303030

Shades & Tints Shades & Tints

#78726E

Dark

Light

#C44545

Dark

Light

#FF0000

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #78726e;
  --color-2: #c44545;
  --color-3: #ff0000;
  --color-4: #94002a;
  --color-5: #402830;
}

SCSS

$color-1: #78726e;
$color-2: #c44545;
$color-3: #ff0000;
$color-4: #94002a;
$color-5: #402830;

TAILWIND

colors: {
  'brand-1': '#78726e',
  'brand-2': '#c44545',
  'brand-3': '#ff0000',
  'brand-4': '#94002a',
  'brand-5': '#402830',
}

RGB Array

[120, 114, 110], [196, 69, 69], [255, 0, 0], [148, 0, 42], [64, 40, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #78726E, #C44545, #FF0000, #94002A, #402830 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: #78726e; --color-2: #c44545; --color-3: #ff0000; --color-4: #94002a; --color-5: #402830. 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