← Back to Editor

#A89060 · #907848 · #784848 · #603030 · #481830

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

#A89060

Ginger · Gray · Sunflower

HEX
#A89060
RGB
rgb(168, 144, 96)
HSL
hsl(40, 29%, 52%)
HSB
hsb(40, 43%, 66%)
CMYK
cmyk(0%, 14%, 43%, 34%)
Oklch
oklch(66.4% 0.071 84.0)

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

#907848

Ochre · Sienna · Honey Gold

HEX
#907848
RGB
rgb(144, 120, 72)
HSL
hsl(40, 33%, 42%)
HSB
hsb(40, 50%, 56%)
CMYK
cmyk(0%, 17%, 50%, 44%)
Oklch
oklch(58.4% 0.072 83.7)

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

#784848

Crimson · DimGray · Wine Red

HEX
#784848
RGB
rgb(120, 72, 72)
HSL
hsl(0, 25%, 38%)
HSB
hsb(0, 40%, 47%)
CMYK
cmyk(0%, 40%, 40%, 53%)
Oklch
oklch(45.8% 0.066 19.9)

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

#603030

Crimson · DarkOliveGreen · Wine Red

HEX
#603030
RGB
rgb(96, 48, 48)
HSL
hsl(0, 33%, 28%)
HSB
hsb(0, 50%, 38%)
CMYK
cmyk(0%, 50%, 50%, 62%)
Oklch
oklch(37.2% 0.070 21.0)

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

#481830

Dark Violet · DarkSlateGray · Raspberry

HEX
#481830
RGB
rgb(72, 24, 48)
HSL
hsl(330, 50%, 19%)
HSB
hsb(330, 67%, 28%)
CMYK
cmyk(0%, 67%, 33%, 72%)
Oklch
oklch(29.2% 0.079 352.0)

Traditional「Dark Violet」· Paint「Raspberry」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A89060
6179A8

Analogous

A86D61
A89060
9CA861

Triadic

A89060
61A890
9061A8

Split-Comp.

A89060
619CA8
6D61A8

Tetradic

A89060
61A86D
6179A8
A8619C

Contrast Matrix WCAG 2.1 Contrast

A89060
907848
784848
603030
481830
—
1.4
Fail
2.4
Fail
3.5
AA Large
4.7
AA
1.4
Fail
—
1.8
Fail
2.5
Fail
3.4
AA Large
2.4
Fail
1.8
Fail
—
1.4
Fail
1.9
Fail
3.5
AA Large
2.5
Fail
1.4
Fail
—
1.4
Fail
4.7
AA
3.4
AA Large
1.9
Fail
1.4
Fail
—
White BG
3.1AA Large
4.2AA Large
7.4AAA
10.7AAA
14.5AAA
Black BG
6.8AA
5.0AA
2.8Fail
2.0Fail
1.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

9E9D6C
868554
636348
4B4B30
33332A

Deuteranopia

9FA16E
878956
666A48
4E5230
363A29

Tritanopia

A77577
8F5D5F
764848
5E3030
462625

Achromatopsia

929292
7A7A7A
565656
3E3E3E
292929

Shades & Tints Shades & Tints

#A89060

Dark
Light

#907848

Dark
Light

#784848

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a89060;
  --color-2: #907848;
  --color-3: #784848;
  --color-4: #603030;
  --color-5: #481830;
}

SCSS

$color-1: #a89060;
$color-2: #907848;
$color-3: #784848;
$color-4: #603030;
$color-5: #481830;

TAILWIND

colors: {
  'brand-1': '#a89060',
  'brand-2': '#907848',
  'brand-3': '#784848',
  'brand-4': '#603030',
  'brand-5': '#481830',
}

RGB Array

[168, 144, 96], [144, 120, 72], [120, 72, 72], [96, 48, 48], [72, 24, 48]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A89060, #907848, #784848, #603030, #481830 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: #a89060; --color-2: #907848; --color-3: #784848; --color-4: #603030; --color-5: #481830. 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