← Back to Editor

#C77215 · #DD9F28 · #A04006 · #6A1802 · #1C110E

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

Color Details Color Details

#C77215

Ochre · Chocolate · Amber Brown

HEX
#C77215
RGB
rgb(199, 114, 21)
HSL
hsl(31, 81%, 43%)
HSB
hsb(31, 89%, 78%)
CMYK
cmyk(0%, 43%, 89%, 22%)
Oklch
oklch(63.4% 0.142 60.1)

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

#DD9F28

Ginger · GoldenRod · Warm Sun

HEX
#DD9F28
RGB
rgb(221, 159, 40)
HSL
hsl(39, 73%, 51%)
HSB
hsb(39, 82%, 87%)
CMYK
cmyk(0%, 28%, 82%, 13%)
Oklch
oklch(74.4% 0.144 78.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#A04006

Tangerine · Brown · Amber Brown

HEX
#A04006
RGB
rgb(160, 64, 6)
HSL
hsl(23, 93%, 33%)
HSB
hsb(23, 96%, 63%)
CMYK
cmyk(0%, 60%, 96%, 37%)
Oklch
oklch(49.5% 0.141 44.1)

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

#6A1802

Vermilion · Maroon · Wine Red

HEX
#6A1802
RGB
rgb(106, 24, 2)
HSL
hsl(13, 96%, 21%)
HSB
hsb(13, 98%, 42%)
CMYK
cmyk(0%, 77%, 98%, 58%)
Oklch
oklch(34.7% 0.119 35.1)

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

#1C110E

Crimson · Black · Deep Berry

HEX
#1C110E
RGB
rgb(28, 17, 14)
HSL
hsl(13, 33%, 8%)
HSB
hsb(13, 50%, 11%)
CMYK
cmyk(0%, 39%, 50%, 89%)
Oklch
oklch(19.1% 0.020 35.8)

Traditional「Crimson」· Paint「Deep Berry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C77215
156BC6

Analogous

C61815
C77215
C4C615

Triadic

C77215
15C671
7115C6

Split-Comp.

C77215
15C4C6
1815C6

Tetradic

C77215
15C618
156BC6
C615C4

Contrast Matrix WCAG 2.1 Contrast

C77215
DD9F28
A04006
6A1802
1C110E
—
1.6
Fail
1.8
Fail
3.4
AA Large
5.1
AA
1.6
Fail
—
2.8
Fail
5.2
AA
8.0
AAA
1.8
Fail
2.8
Fail
—
1.9
Fail
2.8
Fail
3.4
AA Large
5.2
AA
1.9
Fail
—
1.5
Fail
5.1
AA
8.0
AAA
2.8
Fail
1.5
Fail
—
White BG
3.6AA Large
2.3Fail
6.5AA
12.0AAA
18.5AAA
Black BG
5.8AA
9.1AAA
3.2AA Large
1.7Fail
1.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A2A12C
C2C245
767614
464607
17170F

Deuteranopia

A7AD31
C6CA4C
7C8317
4B5109
18190F

Tritanopia

C33D41
DA5C61
9B1F22
660C0C
1B0F0F

Achromatopsia

818181
A4A4A4
565656
2E2E2E
141414

Shades & Tints Shades & Tints

#C77215

Dark
Light

#DD9F28

Dark
Light

#A04006

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c77215;
  --color-2: #dd9f28;
  --color-3: #a04006;
  --color-4: #6a1802;
  --color-5: #1c110e;
}

SCSS

$color-1: #c77215;
$color-2: #dd9f28;
$color-3: #a04006;
$color-4: #6a1802;
$color-5: #1c110e;

TAILWIND

colors: {
  'brand-1': '#c77215',
  'brand-2': '#dd9f28',
  'brand-3': '#a04006',
  'brand-4': '#6a1802',
  'brand-5': '#1c110e',
}

RGB Array

[199, 114, 21], [221, 159, 40], [160, 64, 6], [106, 24, 2], [28, 17, 14]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C77215, #DD9F28, #A04006, #6A1802, #1C110E is ideal for: social media posters, mobile apps, e-commerce promos, tech websites, dark mode UIs, game UIs, infographics, data visualization, accessible design. Vivid colors effectively attract user attention. High contrast ensures clear visual hierarchy and readability. 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: #c77215; --color-2: #dd9f28; --color-3: #a04006; --color-4: #6a1802; --color-5: #1c110e. 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 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