← Back to Editor

#261A2B · #645A55 · #8F2615 · #853A10 · #7A4D0A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#261A2B

Dark Plum · Black · Dark Purple

HEX
#261A2B
RGB
rgb(38, 26, 43)
HSL
hsl(282, 25%, 14%)
HSB
hsb(282, 40%, 17%)
CMYK
cmyk(12%, 40%, 0%, 83%)
Oklch
oklch(24.1% 0.036 315.7)

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

#645A55

Tangerine · DimGray · Charcoal

HEX
#645A55
RGB
rgb(100, 90, 85)
HSL
hsl(20, 8%, 36%)
HSB
hsb(20, 15%, 39%)
CMYK
cmyk(0%, 10%, 15%, 61%)
Oklch
oklch(47.6% 0.015 48.4)

Traditional「Tangerine」· Paint「Charcoal」· Creative Midnight Shadow

#8F2615

Vermilion · Brown · Wine Red

HEX
#8F2615
RGB
rgb(143, 38, 21)
HSL
hsl(8, 74%, 32%)
HSB
hsb(8, 85%, 56%)
CMYK
cmyk(0%, 73%, 85%, 44%)
Oklch
oklch(43.4% 0.143 31.9)

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

#853A10

Tangerine · Brown · Amber Brown

HEX
#853A10
RGB
rgb(133, 58, 16)
HSL
hsl(22, 79%, 29%)
HSB
hsb(22, 88%, 52%)
CMYK
cmyk(0%, 56%, 88%, 48%)
Oklch
oklch(44.3% 0.115 45.3)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

#7A4D0A

Ochre · Sienna · Amber Brown

HEX
#7A4D0A
RGB
rgb(122, 77, 10)
HSL
hsl(36, 85%, 26%)
HSB
hsb(36, 92%, 48%)
CMYK
cmyk(0%, 37%, 92%, 52%)
Oklch
oklch(46.1% 0.096 69.5)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

261A2B
202D1B

Analogous

1E1B2D
261A2B
2D1B29

Triadic

261A2B
2D271B
1B2D27

Split-Comp.

261A2B
292D1B
1B2D1E

Tetradic

261A2B
2D1E1B
202D1B
1B292D

Contrast Matrix WCAG 2.1 Contrast

261A2B
645A55
8F2615
853A10
7A4D0A
—
2.5
Fail
1.9
Fail
2.1
Fail
2.3
Fail
2.5
Fail
—
1.3
Fail
1.2
Fail
1.1
Fail
1.9
Fail
1.3
Fail
—
1.1
Fail
1.2
Fail
2.1
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
2.3
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
White BG
16.6AAA
6.7AA
8.6AAA
8.0AAA
7.3AAA
Black BG
1.3Fail
3.1AA Large
2.5Fail
2.6Fail
2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

212127
606056
626119
65641A
67661A

Deuteranopia

222226
606157
68701A
696F1D
696C1E

Tritanopia

252423
645757
8A1C1D
812224
78272A

Achromatopsia

202020
5C5C5C
434343
4C4C4C
535353

Shades & Tints Shades & Tints

#261A2B

Dark
Light

#645A55

Dark
Light

#8F2615

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #261a2b;
  --color-2: #645a55;
  --color-3: #8f2615;
  --color-4: #853a10;
  --color-5: #7a4d0a;
}

SCSS

$color-1: #261a2b;
$color-2: #645a55;
$color-3: #8f2615;
$color-4: #853a10;
$color-5: #7a4d0a;

TAILWIND

colors: {
  'brand-1': '#261a2b',
  'brand-2': '#645a55',
  'brand-3': '#8f2615',
  'brand-4': '#853a10',
  'brand-5': '#7a4d0a',
}

RGB Array

[38, 26, 43], [100, 90, 85], [143, 38, 21], [133, 58, 16], [122, 77, 10]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #261A2B, #645A55, #8F2615, #853A10, #7A4D0A 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: #261a2b; --color-2: #645a55; --color-3: #8f2615; --color-4: #853a10; --color-5: #7a4d0a. 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