← Back to Editor

#FCF8F7 · #EDB137 · #E29642 · #828558 · #4E3E3E

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

#FCF8F7

Peach Pink · Snow · Cherry Blossom

HEX
#FCF8F7
RGB
rgb(252, 248, 247)
HSL
hsl(12, 45%, 98%)
HSB
hsb(12, 2%, 99%)
CMYK
cmyk(0%, 2%, 2%, 1%)
Oklch
oklch(98.2% 0.004 34.3)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

#EDB137

Ginger · GoldenRod · Sunflower

HEX
#EDB137
RGB
rgb(237, 177, 55)
HSL
hsl(40, 83%, 57%)
HSB
hsb(40, 77%, 93%)
CMYK
cmyk(0%, 25%, 77%, 7%)
Oklch
oklch(79.6% 0.148 80.7)

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

#E29642

Ginger · SandyBrown · Warm Sun

HEX
#E29642
RGB
rgb(226, 150, 66)
HSL
hsl(32, 73%, 57%)
HSB
hsb(32, 71%, 89%)
CMYK
cmyk(0%, 34%, 71%, 11%)
Oklch
oklch(73.5% 0.134 65.4)

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

#828558

Autumn Sage · Gray · Honey Gold

HEX
#828558
RGB
rgb(130, 133, 88)
HSL
hsl(64, 20%, 43%)
HSB
hsb(64, 34%, 52%)
CMYK
cmyk(2%, 0%, 34%, 48%)
Oklch
oklch(60.3% 0.064 111.4)

Traditional「Autumn Sage」· Paint「Honey Gold」· Creative Blush Sunrise

#4E3E3E

Crimson · DarkSlateGray · Wine Red

HEX
#4E3E3E
RGB
rgb(78, 62, 62)
HSL
hsl(0, 11%, 27%)
HSB
hsb(0, 21%, 31%)
CMYK
cmyk(0%, 21%, 21%, 69%)
Oklch
oklch(38.1% 0.022 18.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCF8F7
F8FBFC

Analogous

FCF8F9
FCF8F7
FCFBF8

Triadic

FCF8F7
F8FCF9
F9F8FC

Split-Comp.

FCF8F7
F8FCFB
F8F9FC

Tetradic

FCF8F7
F9FCF8
F8FBFC
FBF8FC

Contrast Matrix WCAG 2.1 Contrast

FCF8F7
EDB137
E29642
828558
4E3E3E
—
1.8
Fail
2.3
Fail
3.7
AA Large
9.6
AAA
1.8
Fail
—
1.3
Fail
2.0
Fail
5.3
AA
2.3
Fail
1.3
Fail
—
1.6
Fail
4.2
AA Large
3.7
AA Large
2.0
Fail
1.6
Fail
—
2.6
Fail
9.6
AAA
5.3
AA
4.2
AA Large
2.6
Fail
—
White BG
1.1Fail
1.9Fail
2.4Fail
3.9AA Large
10.1AAA
Black BG
19.9AAA
10.9AAA
8.7AAA
5.4AA
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

FAFAF7
D3D255
C1C056
838363
47473E

Deuteranopia

FBFBF7
D7DB5C
C6CB5B
838366
48493E

Tritanopia

FCF7F7
EA6C71
DE666A
826B6D
4D3E3E

Achromatopsia

F9F9F9
B5B5B5
A3A3A3
7F7F7F
434343

Shades & Tints Shades & Tints

#FCF8F7

Dark
Light

#EDB137

Dark
Light

#E29642

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcf8f7;
  --color-2: #edb137;
  --color-3: #e29642;
  --color-4: #828558;
  --color-5: #4e3e3e;
}

SCSS

$color-1: #fcf8f7;
$color-2: #edb137;
$color-3: #e29642;
$color-4: #828558;
$color-5: #4e3e3e;

TAILWIND

colors: {
  'brand-1': '#fcf8f7',
  'brand-2': '#edb137',
  'brand-3': '#e29642',
  'brand-4': '#828558',
  'brand-5': '#4e3e3e',
}

RGB Array

[252, 248, 247], [237, 177, 55], [226, 150, 66], [130, 133, 88], [78, 62, 62]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCF8F7, #EDB137, #E29642, #828558, #4E3E3E 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: #fcf8f7; --color-2: #edb137; --color-3: #e29642; --color-4: #828558; --color-5: #4e3e3e. 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