#F4F0D4 + #F5ECB2 + #F1D199 + #AFB39D + #8F8472 · neon - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

FuturisticEnergeticRebelliousWarm

Industry INDUSTRY

GamingWeb3 / CryptoDeep Tech

UI Context UI CONTEXT

Dark Mode UIDashboardCampaign Page

Color Details Color Details

#F4F0D4

Fresh Green · Beige · Lemon Cream

HEX

#F4F0D4

RGB

rgb(244, 240, 212)

HSL

hsl(52, 59%, 89%)

HSB

hsb(52, 13%, 96%)

CMYK

cmyk(0%, 2%, 13%, 4%)

Oklch

oklch(95.1% 0.037 100.4)

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

#F5ECB2

Fresh Green · Wheat · Lemon Cream

HEX

#F5ECB2

RGB

rgb(245, 236, 178)

HSL

hsl(52, 77%, 83%)

HSB

hsb(52, 27%, 96%)

CMYK

cmyk(0%, 4%, 27%, 4%)

Oklch

oklch(93.6% 0.075 100.3)

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

#F1D199

Goose Yellow · Khaki · Peach Orange

HEX

#F1D199

RGB

rgb(241, 209, 153)

HSL

hsl(38, 76%, 77%)

HSB

hsb(38, 37%, 95%)

CMYK

cmyk(0%, 13%, 37%, 5%)

Oklch

oklch(87.5% 0.080 81.3)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#AFB39D

Willow Green · DarkGray · Apple Green

HEX

#AFB39D

RGB

rgb(175, 179, 157)

HSL

hsl(71, 13%, 66%)

HSB

hsb(71, 12%, 70%)

CMYK

cmyk(2%, 0%, 12%, 30%)

Oklch

oklch(75.7% 0.031 115.5)

Traditional「Willow Green」· Paint「Apple Green」· Creative Mint Breeze

#8F8472

Ochre · Gray · Amber Brown

HEX

#8F8472

RGB

rgb(143, 132, 114)

HSL

hsl(37, 11%, 50%)

HSB

hsb(37, 20%, 56%)

CMYK

cmyk(0%, 8%, 20%, 44%)

Oklch

oklch(61.8% 0.029 80.1)

Traditional「Ochre」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F4F0D4

D2D7F3

Analogous

F3DFD2

F4F0D4

E7F3D2

Triadic

F4F0D4

D2F3EF

EFD2F3

Split-Comp.

F4F0D4

D2E7F3

DFD2F3

Tetradic

F4F0D4

D2F3DF

D2D7F3

F3D2E7

Contrast Matrix WCAG 2.1 Contrast

F4F0D4	F5ECB2	F1D199	AFB39D	8F8472
—	1.0 Fail	1.3 Fail	1.9 Fail	3.2 AA Large
1.0 Fail	—	1.2 Fail	1.8 Fail	3.1 AA Large
1.3 Fail	1.2 Fail	—	1.5 Fail	2.5 Fail
1.9 Fail	1.8 Fail	1.5 Fail	—	1.7 Fail
3.2 AA Large	3.1 AA Large	2.5 Fail	1.7 Fail	—

White BG

1.1Fail

1.2Fail

1.5Fail

2.2Fail

3.7AA Large

Black BG

18.3AAA

17.5AAA

14.3AAA

9.8AAA

5.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

F2F2DB

F1F1C0

E3E3A7

B1B1A2

8A8A76

Deuteranopia

F3F3DC

F2F2C3

E5E7AA

B1B0A4

8B8C77

Tritanopia

F4E0E1

F5CBCE

EFB1B4

AFA7A7

8E7A7B

Achromatopsia

EEEEEE

E8E8E8

D4D4D4

AFAFAF

858585

Shades & Tints Shades & Tints

#F4F0D4

Dark

Light

#F5ECB2

Dark

Light

#F1D199

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f4f0d4;
  --color-2: #f5ecb2;
  --color-3: #f1d199;
  --color-4: #afb39d;
  --color-5: #8f8472;
}

SCSS

$color-1: #f4f0d4;
$color-2: #f5ecb2;
$color-3: #f1d199;
$color-4: #afb39d;
$color-5: #8f8472;

TAILWIND

colors: {
  'brand-1': '#f4f0d4',
  'brand-2': '#f5ecb2',
  'brand-3': '#f1d199',
  'brand-4': '#afb39d',
  'brand-5': '#8f8472',
}

RGB Array

[244, 240, 212], [245, 236, 178], [241, 209, 153], [175, 179, 157], [143, 132, 114]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This neon-style palette of #F4F0D4, #F5ECB2, #F1D199, #AFB39D, #8F8472 is ideal for: health products, baby brands, fresh-style blogs. 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: #f4f0d4; --color-2: #f5ecb2; --color-3: #f1d199; --color-4: #afb39d; --color-5: #8f8472. 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?

Light tones suit backgrounds; use dark colors for body text. Mid-tones work for card backgrounds or dividers to add depth. 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 neon-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