← Back to Editor

#601818 · #483030 · #480018 · #486060 · #300000

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#601818

Crimson · Maroon · Wine Red

HEX
#601818
RGB
rgb(96, 24, 24)
HSL
hsl(0, 60%, 24%)
HSB
hsb(0, 75%, 38%)
CMYK
cmyk(0%, 75%, 75%, 62%)
Oklch
oklch(33.0% 0.104 24.9)

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

#483030

Crimson · DarkSlateGray · Wine Red

HEX
#483030
RGB
rgb(72, 48, 48)
HSL
hsl(0, 20%, 24%)
HSB
hsb(0, 33%, 28%)
CMYK
cmyk(0%, 33%, 33%, 72%)
Oklch
oklch(33.8% 0.035 19.1)

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

#480018

Dark Violet · Maroon · Raspberry

HEX
#480018
RGB
rgb(72, 0, 24)
HSL
hsl(340, 100%, 14%)
HSB
hsb(340, 100%, 28%)
CMYK
cmyk(0%, 100%, 67%, 72%)
Oklch
oklch(25.7% 0.103 9.6)

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

#486060

Slate Blue · DarkSlateGray · Mint Ice

HEX
#486060
RGB
rgb(72, 96, 96)
HSL
hsl(180, 14%, 33%)
HSB
hsb(180, 25%, 38%)
CMYK
cmyk(25%, 0%, 0%, 62%)
Oklch
oklch(47.0% 0.029 196.2)

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

#300000

Vermilion · Black · Deep Berry

HEX
#300000
RGB
rgb(48, 0, 0)
HSL
hsl(0, 100%, 9%)
HSB
hsb(0, 100%, 19%)
CMYK
cmyk(0%, 100%, 100%, 81%)
Oklch
oklch(19.4% 0.080 29.2)

Traditional「Vermilion」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

601818
186262

Analogous

62183D
601818
623D18

Triadic

601818
186218
181862

Split-Comp.

601818
18623D
183D62

Tetradic

601818
3D6218
186262
3D1862

Contrast Matrix WCAG 2.1 Contrast

601818
483030
480018
486060
300000
—
1.1
Fail
1.3
Fail
1.9
Fail
1.5
Fail
1.1
Fail
—
1.4
Fail
1.8
Fail
1.5
Fail
1.3
Fail
1.4
Fail
—
2.4
Fail
1.1
Fail
1.9
Fail
1.8
Fail
2.4
Fail
—
2.8
Fail
1.5
Fail
1.5
Fail
1.1
Fail
2.8
Fail
—
White BG
12.8AAA
12.1AAA
16.3AAA
6.7AA
18.7AAA
Black BG
1.6Fail
1.7Fail
1.3Fail
3.1AA Large
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

414018
3E3D30
292812
525360
1B1B00

Deuteranopia

454A18
3F4130
2D3211
514F60
1E2200

Tritanopia

5C1818
473030
440E0D
496060
2E0000

Achromatopsia

2E2E2E
373737
181818
595959
0E0E0E

Shades & Tints Shades & Tints

#601818

Dark
Light

#483030

Dark
Light

#480018

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #601818;
  --color-2: #483030;
  --color-3: #480018;
  --color-4: #486060;
  --color-5: #300000;
}

SCSS

$color-1: #601818;
$color-2: #483030;
$color-3: #480018;
$color-4: #486060;
$color-5: #300000;

TAILWIND

colors: {
  'brand-1': '#601818',
  'brand-2': '#483030',
  'brand-3': '#480018',
  'brand-4': '#486060',
  'brand-5': '#300000',
}

RGB Array

[96, 24, 24], [72, 48, 48], [72, 0, 24], [72, 96, 96], [48, 0, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #601818, #483030, #480018, #486060, #300000 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: #601818; --color-2: #483030; --color-3: #480018; --color-4: #486060; --color-5: #300000. 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