← Back to Editor

#C1AA47 · #A48648 · #CE461E · #8D1D25 · #501921

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 Library

Color Details Color Details

#C1AA47

Ginger · GoldenRod · Sunflower

HEX
#C1AA47
RGB
rgb(193, 170, 71)
HSL
hsl(49, 50%, 52%)
HSB
hsb(49, 63%, 76%)
CMYK
cmyk(0%, 12%, 63%, 24%)
Oklch
oklch(73.9% 0.121 96.2)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#A48648

Ochre · Sienna · Honey Gold

HEX
#A48648
RGB
rgb(164, 134, 72)
HSL
hsl(40, 39%, 46%)
HSB
hsb(40, 56%, 64%)
CMYK
cmyk(0%, 18%, 56%, 36%)
Oklch
oklch(63.5% 0.089 84.0)

Traditional「Ochre」· Paint「Honey Gold」· Creative Blush Sunrise

#CE461E

Vermilion · Chocolate · Passion Red

HEX
#CE461E
RGB
rgb(206, 70, 30)
HSL
hsl(14, 75%, 46%)
HSB
hsb(14, 85%, 81%)
CMYK
cmyk(0%, 66%, 85%, 19%)
Oklch
oklch(58.0% 0.179 36.1)

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

#8D1D25

Vermilion · Brown · Wine Red

HEX
#8D1D25
RGB
rgb(141, 29, 37)
HSL
hsl(356, 66%, 33%)
HSB
hsb(356, 79%, 55%)
CMYK
cmyk(0%, 79%, 74%, 45%)
Oklch
oklch(42.4% 0.147 22.8)

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

#501921

Crimson · Maroon · Wine Red

HEX
#501921
RGB
rgb(80, 25, 33)
HSL
hsl(351, 52%, 21%)
HSB
hsb(351, 69%, 31%)
CMYK
cmyk(0%, 69%, 59%, 69%)
Oklch
oklch(30.3% 0.083 14.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C1AA47
475EC2

Analogous

C26E47
C1AA47
9BC247

Triadic

C1AA47
47C2AB
AB47C2

Split-Comp.

C1AA47
479BC2
6E47C2

Tetradic

C1AA47
47C26E
475EC2
C2479B

Contrast Matrix WCAG 2.1 Contrast

C1AA47
A48648
CE461E
8D1D25
501921
—
1.5
Fail
2.0
Fail
3.9
AA Large
6.1
AA
1.5
Fail
—
1.3
Fail
2.6
Fail
4.0
AA Large
2.0
Fail
1.3
Fail
—
1.9
Fail
3.0
AA Large
3.9
AA Large
2.6
Fail
1.9
Fail
—
1.6
Fail
6.1
AA
4.0
AA Large
3.0
AA Large
1.6
Fail
—
White BG
2.3Fail
3.5AA Large
4.6AA
9.0AAA
14.0AAA
Black BG
9.1AAA
6.1AA
4.5AA
2.3Fail
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

B7B75F
979757
939228
5D5B23
38381F

Deuteranopia

B8BA65
999B5B
9BA52A
636B23
3B401F

Tritanopia

C07276
A26365
C72F31
872221
4D1E1D

Achromatopsia

A6A6A6
888888
6A6A6A
3F3F3F
2A2A2A

Shades & Tints Shades & Tints

#C1AA47

Dark
Light

#A48648

Dark
Light

#CE461E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c1aa47;
  --color-2: #a48648;
  --color-3: #ce461e;
  --color-4: #8d1d25;
  --color-5: #501921;
}

SCSS

$color-1: #c1aa47;
$color-2: #a48648;
$color-3: #ce461e;
$color-4: #8d1d25;
$color-5: #501921;

TAILWIND

colors: {
  'brand-1': '#c1aa47',
  'brand-2': '#a48648',
  'brand-3': '#ce461e',
  'brand-4': '#8d1d25',
  'brand-5': '#501921',
}

RGB Array

[193, 170, 71], [164, 134, 72], [206, 70, 30], [141, 29, 37], [80, 25, 33]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C1AA47, #A48648, #CE461E, #8D1D25, #501921 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: #c1aa47; --color-2: #a48648; --color-3: #ce461e; --color-4: #8d1d25; --color-5: #501921. 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