← Back to Editor

#C48631 · #D97E15 · #A5775F · #030504 · #464952

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

HarmoniousVersatileWarmCool

Industry INDUSTRY

E-commerceBusiness

UI Context UI CONTEXT

Web PageComponent LibraryData Visualization

Color Details Color Details

#C48631

Ochre · Chocolate · Amber Brown

HEX
#C48631
RGB
rgb(196, 134, 49)
HSL
hsl(35, 60%, 48%)
HSB
hsb(35, 75%, 77%)
CMYK
cmyk(0%, 32%, 75%, 23%)
Oklch
oklch(66.8% 0.124 70.7)

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

#D97E15

Ochre · Chocolate · Amber Brown

HEX
#D97E15
RGB
rgb(217, 126, 21)
HSL
hsl(32, 82%, 47%)
HSB
hsb(32, 90%, 85%)
CMYK
cmyk(0%, 42%, 90%, 15%)
Oklch
oklch(67.8% 0.152 61.2)

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

#A5775F

Tangerine · Gray · Warm Sun

HEX
#A5775F
RGB
rgb(165, 119, 95)
HSL
hsl(21, 28%, 51%)
HSB
hsb(21, 42%, 65%)
CMYK
cmyk(0%, 28%, 42%, 35%)
Oklch
oklch(60.9% 0.068 48.6)

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

#030504

Mineral Blue · Black · Dark Green

HEX
#030504
RGB
rgb(3, 5, 4)
HSL
hsl(150, 25%, 2%)
HSB
hsb(150, 40%, 2%)
CMYK
cmyk(40%, 0%, 20%, 98%)
Oklch
oklch(11.0% 0.007 165.2)

Traditional「Mineral Blue」· Paint「Dark Green」· Creative Blush Sunrise

#464952

Indigo · DarkSlateGray · Charcoal

HEX
#464952
RGB
rgb(70, 73, 82)
HSL
hsl(225, 8%, 30%)
HSB
hsb(225, 15%, 32%)
CMYK
cmyk(15%, 11%, 0%, 68%)
Oklch
oklch(40.6% 0.016 271.0)

Traditional「Indigo」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C48631
316EC4

Analogous

C43D31
C48631
B8C431

Triadic

C48631
31C487
8731C4

Split-Comp.

C48631
31B8C4
3D31C4

Tetradic

C48631
31C43D
316EC4
C431B8

Contrast Matrix WCAG 2.1 Contrast

C48631
D97E15
A5775F
030504
464952
—
1.0
Fail
1.3
Fail
6.6
AA
2.9
Fail
1.0
Fail
—
1.3
Fail
6.8
AA
3.0
Fail
1.3
Fail
1.3
Fail
—
5.3
AA
2.3
Fail
6.6
AA
6.8
AA
5.3
AA
—
2.3
Fail
2.9
Fail
3.0
Fail
2.3
Fail
2.3
Fail
—
White BG
3.1AA Large
3.0AA Large
3.9AA Large
20.4AAA
9.0AAA
Black BG
6.8AA
6.9AA
5.4AA
1.0Fail
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A9A946
B2B12E
919165
040404
474750

Deuteranopia

ADB14B
B7BE35
949766
040404
47474F

Tritanopia

C15659
D44247
A3696A
030404
464E4E

Achromatopsia

8F8F8F
8D8D8D
828282
040404
494949

Shades & Tints Shades & Tints

#C48631

Dark
Light

#D97E15

Dark
Light

#A5775F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c48631;
  --color-2: #d97e15;
  --color-3: #a5775f;
  --color-4: #030504;
  --color-5: #464952;
}

SCSS

$color-1: #c48631;
$color-2: #d97e15;
$color-3: #a5775f;
$color-4: #030504;
$color-5: #464952;

TAILWIND

colors: {
  'brand-1': '#c48631',
  'brand-2': '#d97e15',
  'brand-3': '#a5775f',
  'brand-4': '#030504',
  'brand-5': '#464952',
}

RGB Array

[196, 134, 49], [217, 126, 21], [165, 119, 95], [3, 5, 4], [70, 73, 82]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C48631, #D97E15, #A5775F, #030504, #464952 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: #c48631; --color-2: #d97e15; --color-3: #a5775f; --color-4: #030504; --color-5: #464952. 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