#615258 + #B55B2D + #A8562D + #85543C + #615258 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarm

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#615258

Dark Violet · DimGray · Charcoal

HEX

#615258

RGB

rgb(97, 82, 88)

HSL

hsl(336, 8%, 35%)

HSB

hsb(336, 15%, 38%)

CMYK

cmyk(0%, 15%, 9%, 62%)

Oklch

oklch(45.6% 0.022 351.9)

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

#B55B2D

Tangerine · Sienna · Amber Brown

HEX

#B55B2D

RGB

rgb(181, 91, 45)

HSL

hsl(20, 60%, 44%)

HSB

hsb(20, 75%, 71%)

CMYK

cmyk(0%, 50%, 75%, 29%)

Oklch

oklch(57.2% 0.131 45.6)

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

#A8562D

Tangerine · Sienna · Amber Brown

HEX

#A8562D

RGB

rgb(168, 86, 45)

HSL

hsl(20, 58%, 42%)

HSB

hsb(20, 73%, 66%)

CMYK

cmyk(0%, 49%, 73%, 34%)

Oklch

oklch(54.5% 0.121 45.4)

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

#85543C

Tangerine · Sienna · Amber Brown

HEX

#85543C

RGB

rgb(133, 84, 60)

HSL

hsl(20, 38%, 38%)

HSB

hsb(20, 55%, 52%)

CMYK

cmyk(0%, 37%, 55%, 48%)

Oklch

oklch(49.5% 0.075 46.6)

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

#615258

Dark Violet · DimGray · Charcoal

HEX

#615258

RGB

rgb(97, 82, 88)

HSL

hsl(336, 8%, 35%)

HSB

hsb(336, 15%, 38%)

CMYK

cmyk(0%, 15%, 9%, 62%)

Oklch

oklch(45.6% 0.022 351.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

615258

52605B

Analogous

60525F

615258

605452

Triadic

615258

586052

525860

Split-Comp.

615258

526054

525F60

Tetradic

615258

5F6052

52605B

545260

Contrast Matrix WCAG 2.1 Contrast

615258	B55B2D	A8562D	85543C	615258
—	1.6 Fail	1.4 Fail	1.2 Fail	—
1.6 Fail	—	1.1 Fail	1.4 Fail	1.6 Fail
1.4 Fail	1.1 Fail	—	1.2 Fail	1.4 Fail
1.2 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
—	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

7.4AAA

4.7AA

5.2AA

6.3AA

7.4AAA

Black BG

2.9Fail

4.5AA Large

4.0AA Large

3.3AA Large

2.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

5B5A57

8E8D38

848437

706F42

5B5A57

Deuteranopia

5B5C56

939A3B

898F39

737643

5B5C56

Tritanopia

605555

B14143

A43F40

834647

605555

Achromatopsia

575757

717171

6A6A6A

606060

575757

Shades & Tints Shades & Tints

#615258

Dark

Light

#B55B2D

Dark

Light

#A8562D

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #615258;
  --color-2: #b55b2d;
  --color-3: #a8562d;
  --color-4: #85543c;
  --color-5: #615258;
}

SCSS

$color-1: #615258;
$color-2: #b55b2d;
$color-3: #a8562d;
$color-4: #85543c;
$color-5: #615258;

TAILWIND

colors: {
  'brand-1': '#615258',
  'brand-2': '#b55b2d',
  'brand-3': '#a8562d',
  'brand-4': '#85543c',
  'brand-5': '#615258',
}

RGB Array

[97, 82, 88], [181, 91, 45], [168, 86, 45], [133, 84, 60], [97, 82, 88]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #615258, #B55B2D, #A8562D, #85543C, #615258 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: #615258; --color-2: #b55b2d; --color-3: #a8562d; --color-4: #85543c; --color-5: #615258. 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