← Back to Editor

#F2D791 · #F3F4F3 · #BA6237 · #FBF7F5 · #E6B96A

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#F2D791

Goose Yellow · Khaki · Lemon Cream

HEX
#F2D791
RGB
rgb(242, 215, 145)
HSL
hsl(43, 79%, 76%)
HSB
hsb(43, 40%, 95%)
CMYK
cmyk(0%, 11%, 40%, 5%)
Oklch
oklch(88.6% 0.093 89.3)

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

#F3F4F3

Plain White · SeaShell · Cloud White

HEX
#F3F4F3
RGB
rgb(243, 244, 243)
HSL
hsl(120, 4%, 95%)
HSB
hsb(120, 0%, 96%)
CMYK
cmyk(0%, 0%, 0%, 4%)
Oklch
oklch(96.6% 0.002 145.6)

Traditional「Plain White」· Paint「Cloud White」· Creative Morning Mist

#BA6237

Tangerine · Sienna · Amber Brown

HEX
#BA6237
RGB
rgb(186, 98, 55)
HSL
hsl(20, 54%, 47%)
HSB
hsb(20, 70%, 73%)
CMYK
cmyk(0%, 47%, 70%, 27%)
Oklch
oklch(59.1% 0.127 45.3)

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

#FBF7F5

Apricot · Snow · Peach Orange

HEX
#FBF7F5
RGB
rgb(251, 247, 245)
HSL
hsl(20, 43%, 97%)
HSB
hsb(20, 2%, 98%)
CMYK
cmyk(0%, 2%, 2%, 2%)
Oklch
oklch(97.9% 0.005 48.7)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#E6B96A

Ginger · SandyBrown · Warm Sun

HEX
#E6B96A
RGB
rgb(230, 185, 106)
HSL
hsl(38, 71%, 66%)
HSB
hsb(38, 54%, 90%)
CMYK
cmyk(0%, 20%, 54%, 10%)
Oklch
oklch(81.0% 0.110 80.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2D791
91ADF2

Analogous

F2A691
F2D791
DDF291

Triadic

F2D791
91F2D7
D791F2

Split-Comp.

F2D791
91DDF2
A691F2

Tetradic

F2D791
91F2A6
91ADF2
F291DD

Contrast Matrix WCAG 2.1 Contrast

F2D791
F3F4F3
BA6237
FBF7F5
E6B96A
—
1.3
Fail
3.0
AA Large
1.3
Fail
1.3
Fail
1.3
Fail
—
3.9
AA Large
1.0
Fail
1.7
Fail
3.0
AA Large
3.9
AA Large
—
4.0
AA Large
2.4
Fail
1.3
Fail
1.0
Fail
4.0
AA Large
—
1.7
Fail
1.3
Fail
1.7
Fail
2.4
Fail
1.7
Fail
—
White BG
1.4Fail
1.1Fail
4.3AA Large
1.1Fail
1.8Fail
Black BG
14.9AAA
19.0AAA
4.9AA
19.7AAA
11.5AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6A2
F3F3F3
949341
F9F9F5
D3D27D

Deuteranopia

E8EAA6
F3F3F3
99A044
FAFAF6
D5D982

Tritanopia

F1AFB2
F3F3F3
B64A4B
FBF6F6
E48C90

Achromatopsia

D7D7D7
F4F4F4
777777
F8F8F8
BDBDBD

Shades & Tints Shades & Tints

#F2D791

Dark
Light

#F3F4F3

Dark
Light

#BA6237

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2d791;
  --color-2: #f3f4f3;
  --color-3: #ba6237;
  --color-4: #fbf7f5;
  --color-5: #e6b96a;
}

SCSS

$color-1: #f2d791;
$color-2: #f3f4f3;
$color-3: #ba6237;
$color-4: #fbf7f5;
$color-5: #e6b96a;

TAILWIND

colors: {
  'brand-1': '#f2d791',
  'brand-2': '#f3f4f3',
  'brand-3': '#ba6237',
  'brand-4': '#fbf7f5',
  'brand-5': '#e6b96a',
}

RGB Array

[242, 215, 145], [243, 244, 243], [186, 98, 55], [251, 247, 245], [230, 185, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F2D791, #F3F4F3, #BA6237, #FBF7F5, #E6B96A is ideal for: health products, baby brands, fresh-style blogs, 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: #f2d791; --color-2: #f3f4f3; --color-3: #ba6237; --color-4: #fbf7f5; --color-5: #e6b96a. 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. 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