← Back to Editor

#AA6600 · #CC811B · #663405 · #A04711 · #DE6100

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarm

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#AA6600

Ochre · DarkGoldenRod · Amber Brown

HEX
#AA6600
RGB
rgb(170, 102, 0)
HSL
hsl(36, 100%, 33%)
HSB
hsb(36, 100%, 67%)
CMYK
cmyk(0%, 40%, 100%, 33%)
Oklch
oklch(57.3% 0.128 65.9)

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

#CC811B

Ochre · Chocolate · Amber Brown

HEX
#CC811B
RGB
rgb(204, 129, 27)
HSL
hsl(35, 77%, 45%)
HSB
hsb(35, 87%, 80%)
CMYK
cmyk(0%, 37%, 87%, 20%)
Oklch
oklch(66.7% 0.139 67.3)

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

#663405

Tangerine · Maroon · Cinnamon

HEX
#663405
RGB
rgb(102, 52, 5)
HSL
hsl(29, 91%, 21%)
HSB
hsb(29, 95%, 40%)
CMYK
cmyk(0%, 49%, 95%, 60%)
Oklch
oklch(38.3% 0.090 56.2)

Traditional「Tangerine」· Paint「Cinnamon」· Creative Blush Sunrise

#A04711

Tangerine · Sienna · Amber Brown

HEX
#A04711
RGB
rgb(160, 71, 17)
HSL
hsl(23, 81%, 35%)
HSB
hsb(23, 89%, 63%)
CMYK
cmyk(0%, 56%, 89%, 37%)
Oklch
oklch(50.6% 0.133 46.2)

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

#DE6100

Tangerine · Chocolate · Amber Brown

HEX
#DE6100
RGB
rgb(222, 97, 0)
HSL
hsl(26, 100%, 44%)
HSB
hsb(26, 100%, 87%)
CMYK
cmyk(0%, 56%, 100%, 13%)
Oklch
oklch(63.9% 0.177 47.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AA6600
0043A8

Analogous

A81100
AA6600
97A800

Triadic

AA6600
00A865
6500A8

Split-Comp.

AA6600
0097A8
1100A8

Tetradic

AA6600
00A811
0043A8
A80097

Contrast Matrix WCAG 2.1 Contrast

AA6600
CC811B
663405
A04711
DE6100
—
1.5
Fail
2.2
Fail
1.4
Fail
1.3
Fail
1.5
Fail
—
3.3
AA Large
2.0
Fail
1.2
Fail
2.2
Fail
3.3
AA Large
—
1.7
Fail
2.8
Fail
1.4
Fail
2.0
Fail
1.7
Fail
—
1.7
Fail
1.3
Fail
1.2
Fail
2.8
Fail
1.7
Fail
—
White BG
4.6AA
3.1AA Large
10.2AAA
6.2AA
3.6AA Large
Black BG
4.6AA
6.7AA
2.1Fail
3.4AA Large
5.8AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

8D8C19
ACAB34
505010
79791E
A8A717

Deuteranopia

91961F
B0B53A
535713
7F8521
AFB81D

Tritanopia

A72C30
C8474B
63191B
9C282B
D82A2E

Achromatopsia

6F6F6F
8C8C8C
3E3E3E
5B5B5B
7B7B7B

Shades & Tints Shades & Tints

#AA6600

Dark
Light

#CC811B

Dark
Light

#663405

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aa6600;
  --color-2: #cc811b;
  --color-3: #663405;
  --color-4: #a04711;
  --color-5: #de6100;
}

SCSS

$color-1: #aa6600;
$color-2: #cc811b;
$color-3: #663405;
$color-4: #a04711;
$color-5: #de6100;

TAILWIND

colors: {
  'brand-1': '#aa6600',
  'brand-2': '#cc811b',
  'brand-3': '#663405',
  'brand-4': '#a04711',
  'brand-5': '#de6100',
}

RGB Array

[170, 102, 0], [204, 129, 27], [102, 52, 5], [160, 71, 17], [222, 97, 0]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AA6600, #CC811B, #663405, #A04711, #DE6100 is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #aa6600; --color-2: #cc811b; --color-3: #663405; --color-4: #a04711; --color-5: #de6100. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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