#510505 + #804040 + #D5B045 + #754F6F + #510545 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#510505

Vermilion · Maroon · Deep Berry

HEX

#510505

RGB

rgb(81, 5, 5)

HSL

hsl(0, 88%, 17%)

HSB

hsb(0, 94%, 32%)

CMYK

cmyk(0%, 94%, 94%, 68%)

Oklch

oklch(27.8% 0.107 27.9)

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

#804040

Crimson · Sienna · Wine Red

HEX

#804040

RGB

rgb(128, 64, 64)

HSL

hsl(0, 33%, 38%)

HSB

hsb(0, 50%, 50%)

CMYK

cmyk(0%, 50%, 50%, 50%)

Oklch

oklch(45.2% 0.089 21.2)

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

#D5B045

Ginger · GoldenRod · Sunflower

HEX

#D5B045

RGB

rgb(213, 176, 69)

HSL

hsl(45, 63%, 55%)

HSB

hsb(45, 68%, 84%)

CMYK

cmyk(0%, 17%, 68%, 16%)

Oklch

oklch(77.1% 0.130 89.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#754F6F

Rose Purple · DimGray · Eggplant

HEX

#754F6F

RGB

rgb(117, 79, 111)

HSL

hsl(309, 19%, 38%)

HSB

hsb(309, 32%, 46%)

CMYK

cmyk(0%, 32%, 5%, 54%)

Oklch

oklch(48.1% 0.069 332.3)

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

#510545

Rose Purple · MidnightBlue · Dark Purple

HEX

#510545

RGB

rgb(81, 5, 69)

HSL

hsl(309, 88%, 17%)

HSB

hsb(309, 94%, 32%)

CMYK

cmyk(0%, 94%, 15%, 68%)

Oklch

oklch(30.1% 0.126 336.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

510505

055151

Analogous

51052B

510505

512B05

Triadic

510505

055105

050551

Split-Comp.

510505

05512B

052B51

Tetradic

510505

2B5105

055151

2B0551

Contrast Matrix WCAG 2.1 Contrast

510505	804040	D5B045	754F6F	510545
—	2.0 Fail	7.4 AAA	2.3 Fail	1.1 Fail
2.0 Fail	—	3.7 AA Large	1.1 Fail	1.9 Fail
7.4 AAA	3.7 AA Large	—	3.3 AA Large	6.9 AA
2.3 Fail	1.1 Fail	3.3 AA Large	—	2.1 Fail
1.1 Fail	1.9 Fail	6.9 AA	2.1 Fail	—

White BG

15.3AAA

7.7AAA

2.1Fail

6.8AA

14.4AAA

Black BG

1.4Fail

2.7Fail

10.1AAA

3.1AA Large

1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

302F05

646440

C5C55F

656467

302F36

Deuteranopia

353A05

686D40

C7CA65

676A65

353A32

Tritanopia

4D0505

7D4040

D37378

736160

4D2927

Achromatopsia

1C1C1C

535353

AFAFAF

5E5E5E

232323

Shades & Tints Shades & Tints

#510505

Dark

Light

#804040

Dark

Light

#D5B045

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #510505;
  --color-2: #804040;
  --color-3: #d5b045;
  --color-4: #754f6f;
  --color-5: #510545;
}

SCSS

$color-1: #510505;
$color-2: #804040;
$color-3: #d5b045;
$color-4: #754f6f;
$color-5: #510545;

TAILWIND

colors: {
  'brand-1': '#510505',
  'brand-2': '#804040',
  'brand-3': '#d5b045',
  'brand-4': '#754f6f',
  'brand-5': '#510545',
}

RGB Array

[81, 5, 5], [128, 64, 64], [213, 176, 69], [117, 79, 111], [81, 5, 69]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #510505, #804040, #D5B045, #754F6F, #510545 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: #510505; --color-2: #804040; --color-3: #d5b045; --color-4: #754f6f; --color-5: #510545. 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