← Back to Editor

#F4E1B8 · #9EC7B7 · #ACAA9B · #A5826E · #7E514B

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

#F4E1B8

Goose Yellow · Wheat · Lemon Cream

HEX
#F4E1B8
RGB
rgb(244, 225, 184)
HSL
hsl(41, 73%, 84%)
HSB
hsb(41, 25%, 96%)
CMYK
cmyk(0%, 8%, 25%, 4%)
Oklch
oklch(91.5% 0.057 86.1)

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

#9EC7B7

Jade · DarkGray · Apple Green

HEX
#9EC7B7
RGB
rgb(158, 199, 183)
HSL
hsl(157, 27%, 70%)
HSB
hsb(157, 21%, 78%)
CMYK
cmyk(21%, 0%, 8%, 22%)
Oklch
oklch(79.6% 0.049 169.3)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#ACAA9B

Fresh Green · DarkGray · Silver Sand

HEX
#ACAA9B
RGB
rgb(172, 170, 155)
HSL
hsl(53, 9%, 64%)
HSB
hsb(53, 10%, 67%)
CMYK
cmyk(0%, 1%, 10%, 33%)
Oklch
oklch(73.5% 0.021 100.7)

Traditional「Fresh Green」· Paint「Silver Sand」· Creative Urban Concrete

#A5826E

Tangerine · Gray · Warm Sun

HEX
#A5826E
RGB
rgb(165, 130, 110)
HSL
hsl(22, 23%, 54%)
HSB
hsb(22, 33%, 65%)
CMYK
cmyk(0%, 21%, 33%, 35%)
Oklch
oklch(63.5% 0.052 51.2)

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

#7E514B

Crimson · DimGray · Wine Red

HEX
#7E514B
RGB
rgb(126, 81, 75)
HSL
hsl(7, 25%, 39%)
HSB
hsb(7, 40%, 49%)
CMYK
cmyk(0%, 36%, 40%, 51%)
Oklch
oklch(48.4% 0.062 27.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4E1B8
B8CBF4

Analogous

F4C3B8
F4E1B8
E9F4B8

Triadic

F4E1B8
B8F4E1
E1B8F4

Split-Comp.

F4E1B8
B8E9F4
C3B8F4

Tetradic

F4E1B8
B8F4C3
B8CBF4
F4B8E9

Contrast Matrix WCAG 2.1 Contrast

F4E1B8
9EC7B7
ACAA9B
A5826E
7E514B
—
1.4
Fail
1.8
Fail
2.7
Fail
5.2
AA
1.4
Fail
—
1.3
Fail
1.9
Fail
3.6
AA Large
1.8
Fail
1.3
Fail
—
1.5
Fail
2.8
Fail
2.7
Fail
1.9
Fail
1.5
Fail
—
1.9
Fail
5.2
AA
3.6
AA Large
2.8
Fail
1.9
Fail
—
White BG
1.3Fail
1.9Fail
2.3Fail
3.5AA Large
6.6AA
Black BG
16.3AAA
11.3AAA
9.0AAA
6.0AA
3.2AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

ECECC2
B0B0BB
ABAB9F
969673
6B6A4C

Deuteranopia

EDEEC4
ADAABC
ABABA0
989B74
6D704D

Tritanopia

F3CACB
A0BEBF
ACA1A2
A37778
7C4E4E

Achromatopsia

E2E2E2
B9B9B9
A9A9A9
8A8A8A
5E5E5E

Shades & Tints Shades & Tints

#F4E1B8

Dark
Light

#9EC7B7

Dark
Light

#ACAA9B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4e1b8;
  --color-2: #9ec7b7;
  --color-3: #acaa9b;
  --color-4: #a5826e;
  --color-5: #7e514b;
}

SCSS

$color-1: #f4e1b8;
$color-2: #9ec7b7;
$color-3: #acaa9b;
$color-4: #a5826e;
$color-5: #7e514b;

TAILWIND

colors: {
  'brand-1': '#f4e1b8',
  'brand-2': '#9ec7b7',
  'brand-3': '#acaa9b',
  'brand-4': '#a5826e',
  'brand-5': '#7e514b',
}

RGB Array

[244, 225, 184], [158, 199, 183], [172, 170, 155], [165, 130, 110], [126, 81, 75]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F4E1B8, #9EC7B7, #ACAA9B, #A5826E, #7E514B is ideal for: 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: #f4e1b8; --color-2: #9ec7b7; --color-3: #acaa9b; --color-4: #a5826e; --color-5: #7e514b. 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. 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