← Back to Editor

#FAF2DF · #A9918D · #806F74 · #5F545D · #42383E

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 LibraryData Visualization

Color Details Color Details

#FAF2DF

Goose Yellow · Beige · Lemon Cream

HEX
#FAF2DF
RGB
rgb(250, 242, 223)
HSL
hsl(42, 73%, 93%)
HSB
hsb(42, 11%, 98%)
CMYK
cmyk(0%, 3%, 11%, 2%)
Oklch
oklch(96.2% 0.026 87.9)

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

#A9918D

Peach Pink · DarkGray · Coral Red

HEX
#A9918D
RGB
rgb(169, 145, 141)
HSL
hsl(9, 14%, 61%)
HSB
hsb(9, 17%, 66%)
CMYK
cmyk(0%, 14%, 17%, 34%)
Oklch
oklch(67.7% 0.030 29.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#806F74

Ink Gray · Gray · Warm Gray

HEX
#806F74
RGB
rgb(128, 111, 116)
HSL
hsl(342, 7%, 47%)
HSB
hsb(342, 13%, 50%)
CMYK
cmyk(0%, 13%, 9%, 50%)
Oklch
oklch(55.9% 0.023 358.2)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#5F545D

Ink Gray · DimGray · Charcoal

HEX
#5F545D
RGB
rgb(95, 84, 93)
HSL
hsl(311, 6%, 35%)
HSB
hsb(311, 12%, 37%)
CMYK
cmyk(0%, 12%, 2%, 63%)
Oklch
oklch(46.0% 0.020 332.0)

Traditional「Ink Gray」· Paint「Charcoal」· Creative Midnight Shadow

#42383E

Rose Purple · DarkSlateGray · Dark Stone

HEX
#42383E
RGB
rgb(66, 56, 62)
HSL
hsl(324, 8%, 24%)
HSB
hsb(324, 15%, 26%)
CMYK
cmyk(0%, 15%, 6%, 74%)
Oklch
oklch(35.3% 0.017 341.3)

Traditional「Rose Purple」· Paint「Dark Stone」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FAF2DF
E0E8FA

Analogous

FAE5E0
FAF2DF
F5FAE0

Triadic

FAF2DF
E0FAF2
F2E0FA

Split-Comp.

FAF2DF
E0F5FA
E5E0FA

Tetradic

FAF2DF
E0FAE5
E0E8FA
FAE0F5

Contrast Matrix WCAG 2.1 Contrast

FAF2DF
A9918D
806F74
5F545D
42383E
—
2.6
Fail
4.2
AA Large
6.5
AA
10.1
AAA
2.6
Fail
—
1.6
Fail
2.4
Fail
3.8
AA Large
4.2
AA Large
1.6
Fail
—
1.5
Fail
2.4
Fail
6.5
AA
2.4
Fail
1.5
Fail
—
1.6
Fail
10.1
AAA
3.8
AA Large
2.4
Fail
1.6
Fail
—
White BG
1.1Fail
2.9Fail
4.7AA
7.2AAA
11.2AAA
Black BG
18.8AAA
7.1AAA
4.4AA Large
2.9Fail
1.9Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F7F6E4
9F9E8E
797873
5A5A5B
3E3E3D

Deuteranopia

F7F8E5
A0A28E
7A7B72
5B5C5A
3E3F3C

Tritanopia

FAE7E8
A88F8F
7F7272
5E5959
423B3B

Achromatopsia

F2F2F2
989898
757575
585858
3C3C3C

Shades & Tints Shades & Tints

#FAF2DF

Dark
Light

#A9918D

Dark
Light

#806F74

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #faf2df;
  --color-2: #a9918d;
  --color-3: #806f74;
  --color-4: #5f545d;
  --color-5: #42383e;
}

SCSS

$color-1: #faf2df;
$color-2: #a9918d;
$color-3: #806f74;
$color-4: #5f545d;
$color-5: #42383e;

TAILWIND

colors: {
  'brand-1': '#faf2df',
  'brand-2': '#a9918d',
  'brand-3': '#806f74',
  'brand-4': '#5f545d',
  'brand-5': '#42383e',
}

RGB Array

[250, 242, 223], [169, 145, 141], [128, 111, 116], [95, 84, 93], [66, 56, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FAF2DF, #A9918D, #806F74, #5F545D, #42383E is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #faf2df; --color-2: #a9918d; --color-3: #806f74; --color-4: #5f545d; --color-5: #42383e. 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. Restrained colors convey professionalism and trust. 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