← Back to Editor

#662111 · #FF6600 · #D9C032 · #9E7562 · #000000

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 LibraryData Visualization

Color Details Color Details

#662111

Vermilion · Maroon · Wine Red

HEX
#662111
RGB
rgb(102, 33, 17)
HSL
hsl(11, 71%, 23%)
HSB
hsb(11, 83%, 40%)
CMYK
cmyk(0%, 68%, 83%, 60%)
Oklch
oklch(35.2% 0.103 34.4)

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

#FF6600

Tangerine · OrangeRed · Amber Brown

HEX
#FF6600
RGB
rgb(255, 102, 0)
HSL
hsl(24, 100%, 50%)
HSB
hsb(24, 100%, 100%)
CMYK
cmyk(0%, 60%, 100%, 0%)
Oklch
oklch(69.6% 0.204 43.5)

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

#D9C032

Autumn Sage · GoldenRod · Sunflower

HEX
#D9C032
RGB
rgb(217, 192, 50)
HSL
hsl(51, 69%, 52%)
HSB
hsb(51, 77%, 85%)
CMYK
cmyk(0%, 12%, 77%, 15%)
Oklch
oklch(80.6% 0.153 98.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#9E7562

Tangerine · Gray · Amber Brown

HEX
#9E7562
RGB
rgb(158, 117, 98)
HSL
hsl(19, 24%, 50%)
HSB
hsb(19, 38%, 62%)
CMYK
cmyk(0%, 26%, 38%, 38%)
Oklch
oklch(59.8% 0.059 46.0)

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

#000000

Ink Black · Black · Jet Black

HEX
#000000
RGB
rgb(0, 0, 0)
HSL
hsl(0, 0%, 0%)
HSB
hsb(0, 0%, 0%)
CMYK
cmyk(0%, 0%, 0%, 100%)
Oklch
oklch(0.0% 0.000 0.0)

Traditional「Ink Black」· Paint「Jet Black」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

662111
115564

Analogous

64112B
662111
644A11

Triadic

662111
116420
201164

Split-Comp.

662111
11644A
112B64

Tetradic

662111
2B6411
115564
4A1164

Contrast Matrix WCAG 2.1 Contrast

662111
FF6600
D9C032
9E7562
000000
—
4.0
AA Large
6.4
AA
2.9
Fail
1.8
Fail
4.0
AA Large
—
1.6
Fail
1.4
Fail
7.2
AAA
6.4
AA
1.6
Fail
—
2.2
Fail
11.5
AAA
2.9
Fail
1.4
Fail
2.2
Fail
—
5.2
AA
1.8
Fail
7.2
AAA
11.5
AAA
5.2
AA
—
White BG
11.7AAA
2.9Fail
1.8Fail
4.1AA Large
21.0AAA
Black BG
1.8Fail
7.2AAA
11.5AAA
5.2AA
1.0Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

484815
BDBB19
CECE54
8C8C67
000000

Deuteranopia

4C5116
C6D11F
D0D15D
8F9268
000000

Tritanopia

631819
F72C30
D86F75
9C6A6B
000000

Achromatopsia

343434
888888
B7B7B7
7F7F7F
000000

Shades & Tints Shades & Tints

#662111

Dark
Light

#FF6600

Dark
Light

#D9C032

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #662111;
  --color-2: #ff6600;
  --color-3: #d9c032;
  --color-4: #9e7562;
  --color-5: #000000;
}

SCSS

$color-1: #662111;
$color-2: #ff6600;
$color-3: #d9c032;
$color-4: #9e7562;
$color-5: #000000;

TAILWIND

colors: {
  'brand-1': '#662111',
  'brand-2': '#ff6600',
  'brand-3': '#d9c032',
  'brand-4': '#9e7562',
  'brand-5': '#000000',
}

RGB Array

[102, 33, 17], [255, 102, 0], [217, 192, 50], [158, 117, 98], [0, 0, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #662111, #FF6600, #D9C032, #9E7562, #000000 is ideal for: tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #662111; --color-2: #ff6600; --color-3: #d9c032; --color-4: #9e7562; --color-5: #000000. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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