#D46B10 + #A62900 + #832120 + #5F5264 + #646C93 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent Library

Color Details Color Details

#D46B10

Tangerine · Chocolate · Amber Brown

HEX

#D46B10

RGB

rgb(212, 107, 16)

HSL

hsl(28, 86%, 45%)

HSB

hsb(28, 92%, 83%)

CMYK

cmyk(0%, 50%, 92%, 17%)

Oklch

oklch(64.0% 0.158 52.6)

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

#A62900

Tangerine · FireBrick · Amber Brown

HEX

#A62900

RGB

rgb(166, 41, 0)

HSL

hsl(15, 100%, 33%)

HSB

hsb(15, 100%, 65%)

CMYK

cmyk(0%, 75%, 100%, 35%)

Oklch

oklch(47.8% 0.167 35.3)

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

#832120

Vermilion · Brown · Wine Red

HEX

#832120

RGB

rgb(131, 33, 32)

HSL

hsl(1, 61%, 32%)

HSB

hsb(1, 76%, 51%)

CMYK

cmyk(0%, 75%, 76%, 49%)

Oklch

oklch(40.8% 0.133 25.8)

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

#5F5264

Dark Plum · DimGray · Eggplant

HEX

#5F5264

RGB

rgb(95, 82, 100)

HSL

hsl(283, 10%, 36%)

HSB

hsb(283, 18%, 39%)

CMYK

cmyk(5%, 18%, 0%, 61%)

Oklch

oklch(45.8% 0.033 316.6)

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

#646C93

Indigo · SlateGray · Navy Blue

HEX

#646C93

RGB

rgb(100, 108, 147)

HSL

hsl(230, 19%, 48%)

HSB

hsb(230, 32%, 58%)

CMYK

cmyk(32%, 27%, 0%, 42%)

Oklch

oklch(54.0% 0.062 275.2)

Traditional「Indigo」· Paint「Navy Blue」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

D46B10

1079D5

Analogous

D51017

D46B10

D5CF10

Triadic

D46B10

10D56C

6C10D5

Split-Comp.

D46B10

10D5CF

1017D5

Tetradic

D46B10

17D510

1079D5

CF10D5

Contrast Matrix WCAG 2.1 Contrast

D46B10	A62900	832120	5F5264	646C93
—	2.0 Fail	2.7 Fail	2.1 Fail	1.4 Fail
2.0 Fail	—	1.3 Fail	1.0 Fail	1.4 Fail
2.7 Fail	1.3 Fail	—	1.3 Fail	1.9 Fail
2.1 Fail	1.0 Fail	1.3 Fail	—	1.4 Fail
1.4 Fail	1.4 Fail	1.9 Fail	1.4 Fail	—

White BG

3.6AA Large

7.1AAA

9.5AAA

7.3AAA

5.1AA

Black BG

5.9AA

2.9Fail

2.2Fail

2.9Fail

4.1AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

A7A626

706F0A

595820

595960

67688A

Deuteranopia

ADB42B

77810C

5E6620

5A5B5F

676687

Tritanopia

CF373B

A01213

7E2020

5E5C5B

648280

Achromatopsia

808080

4A4A4A

3E3E3E

585858

6E6E6E

Shades & Tints Shades & Tints

#D46B10

Dark

Light

#A62900

Dark

Light

#832120

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #d46b10;
  --color-2: #a62900;
  --color-3: #832120;
  --color-4: #5f5264;
  --color-5: #646c93;
}

SCSS

$color-1: #d46b10;
$color-2: #a62900;
$color-3: #832120;
$color-4: #5f5264;
$color-5: #646c93;

TAILWIND

colors: {
  'brand-1': '#d46b10',
  'brand-2': '#a62900',
  'brand-3': '#832120',
  'brand-4': '#5f5264',
  'brand-5': '#646c93',
}

RGB Array

[212, 107, 16], [166, 41, 0], [131, 33, 32], [95, 82, 100], [100, 108, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #D46B10, #A62900, #832120, #5F5264, #646C93 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: #d46b10; --color-2: #a62900; --color-3: #832120; --color-4: #5f5264; --color-5: #646c93. 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