← Back to Editor

#FCF3A8 · #F0E281 · #BCB25D · #877F34 · #3A4D49

cool

A 5-color cool 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

#FCF3A8

Fresh Green · Wheat · Lemon Cream

HEX
#FCF3A8
RGB
rgb(252, 243, 168)
HSL
hsl(54, 93%, 82%)
HSB
hsb(54, 33%, 99%)
CMYK
cmyk(0%, 4%, 33%, 1%)
Oklch
oklch(95.4% 0.095 102.2)

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

#F0E281

Fresh Green · Khaki · Sunflower

HEX
#F0E281
RGB
rgb(240, 226, 129)
HSL
hsl(52, 79%, 72%)
HSB
hsb(52, 46%, 94%)
CMYK
cmyk(0%, 6%, 46%, 6%)
Oklch
oklch(90.4% 0.119 101.2)

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

#BCB25D

Autumn Sage · Tan · Sunflower

HEX
#BCB25D
RGB
rgb(188, 178, 93)
HSL
hsl(54, 41%, 55%)
HSB
hsb(54, 51%, 74%)
CMYK
cmyk(0%, 5%, 51%, 26%)
Oklch
oklch(75.4% 0.108 102.6)

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

#877F34

Autumn Sage · Sienna · Honey Gold

HEX
#877F34
RGB
rgb(135, 127, 52)
HSL
hsl(54, 44%, 37%)
HSB
hsb(54, 61%, 53%)
CMYK
cmyk(0%, 6%, 61%, 47%)
Oklch
oklch(58.8% 0.097 103.2)

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

#3A4D49

Mineral Blue · DarkSlateGray · Mint Ice

HEX
#3A4D49
RGB
rgb(58, 77, 73)
HSL
hsl(167, 14%, 26%)
HSB
hsb(167, 25%, 30%)
CMYK
cmyk(25%, 0%, 5%, 70%)
Oklch
oklch(40.3% 0.025 180.7)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FCF3A8
A6AFFC

Analogous

FCC9A6
FCF3A8
DAFCA6

Triadic

FCF3A8
A6FCF3
F3A6FC

Split-Comp.

FCF3A8
A6DAFC
C9A6FC

Tetradic

FCF3A8
A6FCC9
A6AFFC
FCA6DA

Contrast Matrix WCAG 2.1 Contrast

FCF3A8
F0E281
BCB25D
877F34
3A4D49
—
1.2
Fail
1.9
Fail
3.6
AA Large
7.9
AAA
1.2
Fail
—
1.6
Fail
3.1
AA Large
6.8
AA
1.9
Fail
1.6
Fail
—
1.9
Fail
4.1
AA Large
3.6
AA Large
3.1
AA Large
1.9
Fail
—
2.2
Fail
7.9
AAA
6.8
AA
4.1
AA Large
2.2
Fail
—
White BG
1.1Fail
1.3Fail
2.2Fail
4.1AA Large
9.0AAA
Black BG
18.5AAA
15.9AAA
9.7AAA
5.1AA
2.3Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F8F8BA
EAEA98
B8B872
848346
42424A

Deuteranopia

F9F9BF
EBEC9E
B8B977
84854B
41404A

Tritanopia

FCC8CC
EFABAF
BC8285
875458
3B4B4B

Achromatopsia

EDEDED
DBDBDB
ABABAB
797979
474747

Shades & Tints Shades & Tints

#FCF3A8

Dark
Light

#F0E281

Dark
Light

#BCB25D

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fcf3a8;
  --color-2: #f0e281;
  --color-3: #bcb25d;
  --color-4: #877f34;
  --color-5: #3a4d49;
}

SCSS

$color-1: #fcf3a8;
$color-2: #f0e281;
$color-3: #bcb25d;
$color-4: #877f34;
$color-5: #3a4d49;

TAILWIND

colors: {
  'brand-1': '#fcf3a8',
  'brand-2': '#f0e281',
  'brand-3': '#bcb25d',
  'brand-4': '#877f34',
  'brand-5': '#3a4d49',
}

RGB Array

[252, 243, 168], [240, 226, 129], [188, 178, 93], [135, 127, 52], [58, 77, 73]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #FCF3A8, #F0E281, #BCB25D, #877F34, #3A4D49 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: #fcf3a8; --color-2: #f0e281; --color-3: #bcb25d; --color-4: #877f34; --color-5: #3a4d49. 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 cool-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