← Back to Editor

#FCFCFA · #F5D667 · #F58A67 · #453232 · #695D59

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

#FCFCFA

Fresh Green · Snow · Lemon Cream

HEX
#FCFCFA
RGB
rgb(252, 252, 250)
HSL
hsl(60, 25%, 98%)
HSB
hsb(60, 1%, 99%)
CMYK
cmyk(0%, 0%, 1%, 1%)
Oklch
oklch(99.1% 0.003 106.4)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#F5D667

Ginger · Khaki · Sunflower

HEX
#F5D667
RGB
rgb(245, 214, 103)
HSL
hsl(47, 88%, 68%)
HSB
hsb(47, 58%, 96%)
CMYK
cmyk(0%, 13%, 58%, 4%)
Oklch
oklch(88.1% 0.134 93.9)

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

#F58A67

Apricot · Salmon · Warm Sun

HEX
#F58A67
RGB
rgb(245, 138, 103)
HSL
hsl(15, 88%, 68%)
HSB
hsb(15, 58%, 96%)
CMYK
cmyk(0%, 44%, 58%, 4%)
Oklch
oklch(74.2% 0.139 38.8)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#453232

Crimson · DarkSlateGray · Wine Red

HEX
#453232
RGB
rgb(69, 50, 50)
HSL
hsl(0, 16%, 23%)
HSB
hsb(0, 28%, 27%)
CMYK
cmyk(0%, 28%, 28%, 73%)
Oklch
oklch(33.9% 0.028 18.6)

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

#695D59

Tangerine · DimGray · Charcoal

HEX
#695D59
RGB
rgb(105, 93, 89)
HSL
hsl(15, 8%, 38%)
HSB
hsb(15, 15%, 41%)
CMYK
cmyk(0%, 11%, 15%, 59%)
Oklch
oklch(48.9% 0.017 39.3)

Traditional「Tangerine」· Paint「Charcoal」· Creative Midnight Shadow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCFCFA
F9F9FB

Analogous

FBFAF9
FCFCFA
FAFBF9

Triadic

FCFCFA
F9FBFB
FBF9FB

Split-Comp.

FCFCFA
F9FAFB
FAF9FB

Tetradic

FCFCFA
F9FBFA
F9F9FB
FBF9FA

Contrast Matrix WCAG 2.1 Contrast

FCFCFA
F5D667
F58A67
453232
695D59
—
1.4
Fail
2.3
Fail
11.6
AAA
6.2
AA
1.4
Fail
—
1.7
Fail
8.4
AAA
4.4
AA Large
2.3
Fail
1.7
Fail
—
5.0
AA
2.6
Fail
11.6
AAA
8.4
AAA
5.0
AA
—
1.9
Fail
6.2
AA
4.4
AA Large
2.6
Fail
1.9
Fail
—
White BG
1.0Fail
1.4Fail
2.4Fail
12.0AAA
6.3AA
Black BG
20.4AAA
14.7AAA
8.7AAA
1.8Fail
3.3AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

FCFCFA
E8E782
C7C66F
3D3D32
64645A

Deuteranopia

FCFCFB
E9EC88
CDD572
3E3F32
65655A

Tritanopia

FCFBFB
F3979C
F07678
443232
685B5B

Achromatopsia

FCFCFC
D3D3D3
A6A6A6
383838
606060

Shades & Tints Shades & Tints

#FCFCFA

Dark
Light

#F5D667

Dark
Light

#F58A67

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcfcfa;
  --color-2: #f5d667;
  --color-3: #f58a67;
  --color-4: #453232;
  --color-5: #695d59;
}

SCSS

$color-1: #fcfcfa;
$color-2: #f5d667;
$color-3: #f58a67;
$color-4: #453232;
$color-5: #695d59;

TAILWIND

colors: {
  'brand-1': '#fcfcfa',
  'brand-2': '#f5d667',
  'brand-3': '#f58a67',
  'brand-4': '#453232',
  'brand-5': '#695d59',
}

RGB Array

[252, 252, 250], [245, 214, 103], [245, 138, 103], [69, 50, 50], [105, 93, 89]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #FCFCFA, #F5D667, #F58A67, #453232, #695D59 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: #fcfcfa; --color-2: #f5d667; --color-3: #f58a67; --color-4: #453232; --color-5: #695d59. 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