#781800 + #C03018 + #789090 + #607878 + #484848 · earth - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#781800

Vermilion · Maroon · Wine Red

HEX

#781800

RGB

rgb(120, 24, 0)

HSL

hsl(12, 100%, 24%)

HSB

hsb(12, 100%, 47%)

CMYK

cmyk(0%, 80%, 100%, 53%)

Oklch

oklch(37.5% 0.134 34.2)

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

#C03018

Vermilion · FireBrick · Passion Red

HEX

#C03018

RGB

rgb(192, 48, 24)

HSL

hsl(9, 78%, 42%)

HSB

hsb(9, 88%, 75%)

CMYK

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

Oklch

oklch(53.3% 0.184 32.0)

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

#789090

Slate Blue · LightSlateGray · Lake Green

HEX

#789090

RGB

rgb(120, 144, 144)

HSL

hsl(180, 10%, 52%)

HSB

hsb(180, 17%, 56%)

CMYK

cmyk(17%, 0%, 0%, 44%)

Oklch

oklch(63.5% 0.027 196.5)

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

#607878

Slate Blue · DimGray · Mint Ice

HEX

#607878

RGB

rgb(96, 120, 120)

HSL

hsl(180, 11%, 42%)

HSB

hsb(180, 20%, 47%)

CMYK

cmyk(20%, 0%, 0%, 53%)

Oklch

oklch(55.4% 0.028 196.4)

Traditional「Slate Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#484848

Dark Cyan · DarkSlateGray · Charcoal

HEX

#484848

RGB

rgb(72, 72, 72)

HSL

hsl(0, 0%, 28%)

HSB

hsb(0, 0%, 28%)

CMYK

cmyk(0%, 0%, 0%, 72%)

Oklch

oklch(40.2% 0.000 89.9)

Traditional「Dark Cyan」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

781800

00627A

Analogous

7A0025

781800

7A5600

Triadic

781800

007A18

18007A

Split-Comp.

781800

007A56

00257A

Tetradic

781800

257A00

00627A

56007A

Contrast Matrix WCAG 2.1 Contrast

781800	C03018	789090	607878	484848
—	1.9 Fail	3.2 AA Large	2.3 Fail	1.2 Fail
1.9 Fail	—	1.7 Fail	1.2 Fail	1.6 Fail
3.2 AA Large	1.7 Fail	—	1.4 Fail	2.7 Fail
2.3 Fail	1.2 Fail	1.4 Fail	—	1.9 Fail
1.2 Fail	1.6 Fail	2.7 Fail	1.9 Fail	—

White BG

10.9AAA

5.7AA

3.4AA Large

4.7AA

9.1AAA

Black BG

1.9Fail

3.7AA Large

6.2AA

4.5AA Large

2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

4E4E06

82801E

828390

6A6B78

484848

Deuteranopia

545B07

8A951F

817F90

696778

484848

Tritanopia

730A0B

B92223

799090

617878

484848

Achromatopsia

323232

585858

898989

717171

484848

Shades & Tints Shades & Tints

#781800

Dark

Light

#C03018

Dark

Light

#789090

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #781800;
  --color-2: #c03018;
  --color-3: #789090;
  --color-4: #607878;
  --color-5: #484848;
}

SCSS

$color-1: #781800;
$color-2: #c03018;
$color-3: #789090;
$color-4: #607878;
$color-5: #484848;

TAILWIND

colors: {
  'brand-1': '#781800',
  'brand-2': '#c03018',
  'brand-3': '#789090',
  'brand-4': '#607878',
  'brand-5': '#484848',
}

RGB Array

[120, 24, 0], [192, 48, 24], [120, 144, 144], [96, 120, 120], [72, 72, 72]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This earth-style palette of #781800, #C03018, #789090, #607878, #484848 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: #781800; --color-2: #c03018; --color-3: #789090; --color-4: #607878; --color-5: #484848. 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 earth-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