← Back to Editor

#A49E7E · #B5AA7C · #CEB37B · #E2C581 · #F7E191

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

WorkspaceReading

Color Details Color Details

#A49E7E

Autumn Sage · DarkSeaGreen · Sunflower

HEX
#A49E7E
RGB
rgb(164, 158, 126)
HSL
hsl(51, 17%, 57%)
HSB
hsb(51, 23%, 64%)
CMYK
cmyk(0%, 4%, 23%, 36%)
Oklch
oklch(69.6% 0.045 98.6)

Traditional「Autumn Sage」· Paint「Sunflower」· Creative Blush Sunrise

#B5AA7C

Ginger · Tan · Sunflower

HEX
#B5AA7C
RGB
rgb(181, 170, 124)
HSL
hsl(48, 28%, 60%)
HSB
hsb(48, 31%, 71%)
CMYK
cmyk(0%, 6%, 31%, 29%)
Oklch
oklch(73.6% 0.063 96.3)

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

#CEB37B

Ginger · Tan · Sunflower

HEX
#CEB37B
RGB
rgb(206, 179, 123)
HSL
hsl(40, 46%, 65%)
HSB
hsb(40, 40%, 81%)
CMYK
cmyk(0%, 13%, 40%, 19%)
Oklch
oklch(77.7% 0.080 84.9)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#E2C581

Ginger · BurlyWood · Sunflower

HEX
#E2C581
RGB
rgb(226, 197, 129)
HSL
hsl(42, 63%, 70%)
HSB
hsb(42, 43%, 89%)
CMYK
cmyk(0%, 13%, 43%, 11%)
Oklch
oklch(83.3% 0.093 87.3)

Traditional「Ginger」· Paint「Sunflower」· Creative Lemon Fizz

#F7E191

Goose Yellow · Khaki · Lemon Cream

HEX
#F7E191
RGB
rgb(247, 225, 145)
HSL
hsl(47, 86%, 77%)
HSB
hsb(47, 41%, 97%)
CMYK
cmyk(0%, 9%, 41%, 3%)
Oklch
oklch(91.0% 0.103 94.5)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A49E7E
7F84A4

Analogous

A48C7F
A49E7E
97A47F

Triadic

A49E7E
7FA49E
9E7FA4

Split-Comp.

A49E7E
7F97A4
8C7FA4

Tetradic

A49E7E
7FA48C
7F84A4
A47F97

Contrast Matrix WCAG 2.1 Contrast

A49E7E
B5AA7C
CEB37B
E2C581
F7E191
—
1.2
Fail
1.3
Fail
1.6
Fail
2.1
Fail
1.2
Fail
—
1.2
Fail
1.4
Fail
1.8
Fail
1.3
Fail
1.2
Fail
—
1.2
Fail
1.6
Fail
1.6
Fail
1.4
Fail
1.2
Fail
—
1.3
Fail
2.1
Fail
1.8
Fail
1.6
Fail
1.3
Fail
—
White BG
2.7Fail
2.3Fail
2.0Fail
1.7Fail
1.3Fail
Black BG
7.8AAA
9.0AAA
10.4AAA
12.5AAA
16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

A1A186
B0B087
C2C289
D5D591
EDEDA4

Deuteranopia

A2A288
B1B28A
C4C68C
D7D995
EFF0A9

Tritanopia

A48C8D
B49092
CD9396
E19EA1
F6B4B7

Achromatopsia

9C9C9C
A8A8A8
B5B5B5
C6C6C6
DEDEDE

Shades & Tints Shades & Tints

#A49E7E

Dark
Light

#B5AA7C

Dark
Light

#CEB37B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a49e7e;
  --color-2: #b5aa7c;
  --color-3: #ceb37b;
  --color-4: #e2c581;
  --color-5: #f7e191;
}

SCSS

$color-1: #a49e7e;
$color-2: #b5aa7c;
$color-3: #ceb37b;
$color-4: #e2c581;
$color-5: #f7e191;

TAILWIND

colors: {
  'brand-1': '#a49e7e',
  'brand-2': '#b5aa7c',
  'brand-3': '#ceb37b',
  'brand-4': '#e2c581',
  'brand-5': '#f7e191',
}

RGB Array

[164, 158, 126], [181, 170, 124], [206, 179, 123], [226, 197, 129], [247, 225, 145]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A49E7E, #B5AA7C, #CEB37B, #E2C581, #F7E191 is ideal for: health products, baby brands, fresh-style blogs. 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: #a49e7e; --color-2: #b5aa7c; --color-3: #ceb37b; --color-4: #e2c581; --color-5: #f7e191. 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. 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