← Back to Editor

#AA9A7F · #B59072 · #C98351 · #E3642D · #4F302B

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

#AA9A7F

Ginger · DarkGray · Warm Sun

HEX
#AA9A7F
RGB
rgb(170, 154, 127)
HSL
hsl(38, 20%, 58%)
HSB
hsb(38, 25%, 67%)
CMYK
cmyk(0%, 9%, 25%, 33%)
Oklch
oklch(69.3% 0.042 80.8)

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

#B59072

Tangerine · DarkSalmon · Warm Sun

HEX
#B59072
RGB
rgb(181, 144, 114)
HSL
hsl(27, 31%, 58%)
HSB
hsb(27, 37%, 71%)
CMYK
cmyk(0%, 20%, 37%, 29%)
Oklch
oklch(68.0% 0.061 60.5)

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

#C98351

Tangerine · Coral · Warm Sun

HEX
#C98351
RGB
rgb(201, 131, 81)
HSL
hsl(25, 53%, 55%)
HSB
hsb(25, 60%, 79%)
CMYK
cmyk(0%, 35%, 60%, 21%)
Oklch
oklch(67.2% 0.109 55.2)

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

#E3642D

Tangerine · Chocolate · Warm Sun

HEX
#E3642D
RGB
rgb(227, 100, 45)
HSL
hsl(18, 76%, 53%)
HSB
hsb(18, 80%, 89%)
CMYK
cmyk(0%, 56%, 80%, 11%)
Oklch
oklch(65.3% 0.172 41.7)

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

#4F302B

Crimson · DarkSlateGray · Wine Red

HEX
#4F302B
RGB
rgb(79, 48, 43)
HSL
hsl(8, 30%, 24%)
HSB
hsb(8, 46%, 31%)
CMYK
cmyk(0%, 39%, 46%, 69%)
Oklch
oklch(34.6% 0.047 29.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AA9A7F
7E8EA9

Analogous

A9847E
AA9A7F
A4A97E

Triadic

AA9A7F
7EA99A
9A7EA9

Split-Comp.

AA9A7F
7EA4A9
847EA9

Tetradic

AA9A7F
7EA984
7E8EA9
A97EA4

Contrast Matrix WCAG 2.1 Contrast

AA9A7F
B59072
C98351
E3642D
4F302B
—
1.1
Fail
1.1
Fail
1.2
Fail
4.3
AA Large
1.1
Fail
—
1.1
Fail
1.2
Fail
4.0
AA Large
1.1
Fail
1.1
Fail
—
1.1
Fail
3.8
AA Large
1.2
Fail
1.2
Fail
1.1
Fail
—
3.4
AA Large
4.3
AA Large
4.0
AA Large
3.8
AA Large
3.4
AA Large
—
White BG
2.7Fail
2.9Fail
3.1AA Large
3.4AA Large
11.7AAA
Black BG
7.6AAA
7.2AAA
6.8AA
6.1AA
1.8Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

A3A386
A5A579
ABAA5D
ACAB3A
42412C

Deuteranopia

A4A587
A7AA7B
AFB460
B3BD3E
43462D

Tritanopia

A98B8C
B37F80
C66769
DD4547
4D2D2D

Achromatopsia

9C9C9C
989898
929292
848484
393939

Shades & Tints Shades & Tints

#AA9A7F

Dark
Light

#B59072

Dark
Light

#C98351

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aa9a7f;
  --color-2: #b59072;
  --color-3: #c98351;
  --color-4: #e3642d;
  --color-5: #4f302b;
}

SCSS

$color-1: #aa9a7f;
$color-2: #b59072;
$color-3: #c98351;
$color-4: #e3642d;
$color-5: #4f302b;

TAILWIND

colors: {
  'brand-1': '#aa9a7f',
  'brand-2': '#b59072',
  'brand-3': '#c98351',
  'brand-4': '#e3642d',
  'brand-5': '#4f302b',
}

RGB Array

[170, 154, 127], [181, 144, 114], [201, 131, 81], [227, 100, 45], [79, 48, 43]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AA9A7F, #B59072, #C98351, #E3642D, #4F302B is ideal for: corporate websites, product showcases, portfolios. 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: #aa9a7f; --color-2: #b59072; --color-3: #c98351; --color-4: #e3642d; --color-5: #4f302b. 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?

Medium-brightness colors suit brand primary and accent colors. Use the darkest for text, lightest for backgrounds, and mid-tones for emphasis. 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