← Back to Editor

#AAA9A4 · #CE8313 · #F7F4EB · #E6E5E1 · #E4BD23

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#AAA9A4

Ash · DarkGray · Silver Sand

HEX
#AAA9A4
RGB
rgb(170, 169, 164)
HSL
hsl(50, 3%, 65%)
HSB
hsb(50, 4%, 67%)
CMYK
cmyk(0%, 1%, 4%, 33%)
Oklch
oklch(73.4% 0.007 97.4)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#CE8313

Ochre · DarkGoldenRod · Amber Brown

HEX
#CE8313
RGB
rgb(206, 131, 19)
HSL
hsl(36, 83%, 44%)
HSB
hsb(36, 91%, 81%)
CMYK
cmyk(0%, 36%, 91%, 19%)
Oklch
oklch(67.3% 0.143 68.6)

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

#F7F4EB

Goose Yellow · Linen · Lemon Cream

HEX
#F7F4EB
RGB
rgb(247, 244, 235)
HSL
hsl(45, 43%, 95%)
HSB
hsb(45, 5%, 97%)
CMYK
cmyk(0%, 1%, 5%, 3%)
Oklch
oklch(96.7% 0.012 91.5)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#E6E5E1

Goose Yellow · Beige · Cloud White

HEX
#E6E5E1
RGB
rgb(230, 229, 225)
HSL
hsl(48, 9%, 89%)
HSB
hsb(48, 2%, 90%)
CMYK
cmyk(0%, 0%, 2%, 10%)
Oklch
oklch(92.2% 0.005 95.1)

Traditional「Goose Yellow」· Paint「Cloud White」· Creative Silver Lining

#E4BD23

Ginger · GoldenRod · Sunflower

HEX
#E4BD23
RGB
rgb(228, 189, 35)
HSL
hsl(48, 78%, 52%)
HSB
hsb(48, 85%, 89%)
CMYK
cmyk(0%, 17%, 85%, 11%)
Oklch
oklch(81.0% 0.158 93.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AAA9A4
A3A4A8

Analogous

A8A5A3
AAA9A4
A7A8A3

Triadic

AAA9A4
A3A8A8
A8A3A8

Split-Comp.

AAA9A4
A3A7A8
A5A3A8

Tetradic

AAA9A4
A3A8A5
A3A4A8
A8A3A7

Contrast Matrix WCAG 2.1 Contrast

AAA9A4
CE8313
F7F4EB
E6E5E1
E4BD23
—
1.3
Fail
2.1
Fail
1.9
Fail
1.3
Fail
1.3
Fail
—
2.8
Fail
2.4
Fail
1.7
Fail
2.1
Fail
2.8
Fail
—
1.1
Fail
1.6
Fail
1.9
Fail
2.4
Fail
1.1
Fail
—
1.4
Fail
1.3
Fail
1.7
Fail
1.6
Fail
1.4
Fail
—
White BG
2.4Fail
3.1AA Large
1.1Fail
1.3Fail
1.8Fail
Black BG
8.9AAA
6.9AA
19.1AAA
16.7AAA
11.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

AAAAA5
AEAD2E
F6F6ED
E6E6E2
D3D348

Deuteranopia

AAAAA6
B2B835
F6F6EE
E6E6E2
D5D851

Tritanopia

AAA6A6
CA4348
F7EFEF
E6E3E3
E2666C

Achromatopsia

A9A9A9
8D8D8D
F4F4F4
E5E5E5
B7B7B7

Shades & Tints Shades & Tints

#AAA9A4

Dark
Light

#CE8313

Dark
Light

#F7F4EB

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aaa9a4;
  --color-2: #ce8313;
  --color-3: #f7f4eb;
  --color-4: #e6e5e1;
  --color-5: #e4bd23;
}

SCSS

$color-1: #aaa9a4;
$color-2: #ce8313;
$color-3: #f7f4eb;
$color-4: #e6e5e1;
$color-5: #e4bd23;

TAILWIND

colors: {
  'brand-1': '#aaa9a4',
  'brand-2': '#ce8313',
  'brand-3': '#f7f4eb',
  'brand-4': '#e6e5e1',
  'brand-5': '#e4bd23',
}

RGB Array

[170, 169, 164], [206, 131, 19], [247, 244, 235], [230, 229, 225], [228, 189, 35]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AAA9A4, #CE8313, #F7F4EB, #E6E5E1, #E4BD23 is ideal for: health products, baby brands, fresh-style blogs, 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: #aaa9a4; --color-2: #ce8313; --color-3: #f7f4eb; --color-4: #e6e5e1; --color-5: #e4bd23. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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