← Back to Editor

#F3D670 · #F4E1BB · #F7E9D9 · #E1E4AF · #B9E0F1

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#F3D670

Ginger · Khaki · Sunflower

HEX
#F3D670
RGB
rgb(243, 214, 112)
HSL
hsl(47, 85%, 70%)
HSB
hsb(47, 54%, 95%)
CMYK
cmyk(0%, 12%, 54%, 5%)
Oklch
oklch(88.0% 0.126 93.8)

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

#F4E1BB

Goose Yellow · Wheat · Lemon Cream

HEX
#F4E1BB
RGB
rgb(244, 225, 187)
HSL
hsl(40, 72%, 85%)
HSB
hsb(40, 23%, 96%)
CMYK
cmyk(0%, 8%, 23%, 4%)
Oklch
oklch(91.6% 0.054 84.5)

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

#F7E9D9

Goose Yellow · Beige · Peach Orange

HEX
#F7E9D9
RGB
rgb(247, 233, 217)
HSL
hsl(32, 65%, 91%)
HSB
hsb(32, 12%, 97%)
CMYK
cmyk(0%, 6%, 12%, 3%)
Oklch
oklch(94.1% 0.026 71.2)

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

#E1E4AF

Fresh Green · Wheat · Lemon Cream

HEX
#E1E4AF
RGB
rgb(225, 228, 175)
HSL
hsl(63, 50%, 79%)
HSB
hsb(63, 23%, 89%)
CMYK
cmyk(1%, 0%, 23%, 11%)
Oklch
oklch(90.4% 0.069 110.4)

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

#B9E0F1

Sky Blue · LightBlue · Glacier Blue

HEX
#B9E0F1
RGB
rgb(185, 224, 241)
HSL
hsl(198, 67%, 84%)
HSB
hsb(198, 23%, 95%)
CMYK
cmyk(23%, 7%, 0%, 5%)
Oklch
oklch(88.4% 0.047 226.2)

Traditional「Sky Blue」· Paint「Glacier Blue」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F3D670
718EF4

Analogous

F49671
F3D670
CFF471

Triadic

F3D670
71F4D7
D771F4

Split-Comp.

F3D670
71CFF4
9671F4

Tetradic

F3D670
71F496
718EF4
F471CF

Contrast Matrix WCAG 2.1 Contrast

F3D670
F4E1BB
F7E9D9
E1E4AF
B9E0F1
—
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
1.1
Fail
—
1.1
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
1.1
Fail
1.2
Fail
1.1
Fail
1.0
Fail
1.1
Fail
—
1.1
Fail
1.0
Fail
1.1
Fail
1.2
Fail
1.1
Fail
—
White BG
1.4Fail
1.3Fail
1.2Fail
1.3Fail
1.4Fail
Black BG
14.7AAA
16.3AAA
17.6AAA
15.9AAA
15.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E689
ECECC4
F1F1DD
E2E2BC
CACAED

Deuteranopia

E8EA8F
EDEEC6
F2F3DE
E2E2BF
C8C5EC

Tritanopia

F29CA0
F3CBCD
F6E0E1
E1C6C8
BBEAE9

Achromatopsia

D3D3D3
E2E2E2
EBEBEB
DDDDDD
D6D6D6

Shades & Tints Shades & Tints

#F3D670

Dark
Light

#F4E1BB

Dark
Light

#F7E9D9

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f3d670;
  --color-2: #f4e1bb;
  --color-3: #f7e9d9;
  --color-4: #e1e4af;
  --color-5: #b9e0f1;
}

SCSS

$color-1: #f3d670;
$color-2: #f4e1bb;
$color-3: #f7e9d9;
$color-4: #e1e4af;
$color-5: #b9e0f1;

TAILWIND

colors: {
  'brand-1': '#f3d670',
  'brand-2': '#f4e1bb',
  'brand-3': '#f7e9d9',
  'brand-4': '#e1e4af',
  'brand-5': '#b9e0f1',
}

RGB Array

[243, 214, 112], [244, 225, 187], [247, 233, 217], [225, 228, 175], [185, 224, 241]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F3D670, #F4E1BB, #F7E9D9, #E1E4AF, #B9E0F1 is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f3d670; --color-2: #f4e1bb; --color-3: #f7e9d9; --color-4: #e1e4af; --color-5: #b9e0f1. 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 general-style 5-color scheme is especially suited for food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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