← Back to Editor

#F6F2CF · #E7D58D · #BDAA7F · #886350 · #464236

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

#F6F2CF

Fresh Green · Beige · Lemon Cream

HEX
#F6F2CF
RGB
rgb(246, 242, 207)
HSL
hsl(54, 68%, 89%)
HSB
hsb(54, 16%, 96%)
CMYK
cmyk(0%, 2%, 16%, 4%)
Oklch
oklch(95.5% 0.046 101.9)

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

#E7D58D

Goose Yellow · Khaki · Sunflower

HEX
#E7D58D
RGB
rgb(231, 213, 141)
HSL
hsl(48, 65%, 73%)
HSB
hsb(48, 39%, 91%)
CMYK
cmyk(0%, 8%, 39%, 9%)
Oklch
oklch(87.2% 0.093 95.8)

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

#BDAA7F

Ginger · Tan · Sunflower

HEX
#BDAA7F
RGB
rgb(189, 170, 127)
HSL
hsl(42, 32%, 62%)
HSB
hsb(42, 33%, 74%)
CMYK
cmyk(0%, 10%, 33%, 26%)
Oklch
oklch(74.4% 0.062 86.9)

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

#886350

Tangerine · DimGray · Amber Brown

HEX
#886350
RGB
rgb(136, 99, 80)
HSL
hsl(20, 26%, 42%)
HSB
hsb(20, 41%, 53%)
CMYK
cmyk(0%, 27%, 41%, 47%)
Oklch
oklch(53.3% 0.056 48.3)

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

#464236

Ochre · DarkSlateGray · Amber Gold

HEX
#464236
RGB
rgb(70, 66, 54)
HSL
hsl(45, 13%, 24%)
HSB
hsb(45, 23%, 27%)
CMYK
cmyk(0%, 6%, 23%, 73%)
Oklch
oklch(37.9% 0.020 91.8)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6F2CF
D0D4F6

Analogous

F6DFD0
F6F2CF
E7F6D0

Triadic

F6F2CF
D0F6F2
F2D0F6

Split-Comp.

F6F2CF
D0E7F6
DFD0F6

Tetradic

F6F2CF
D0F6DF
D0D4F6
F6D0E7

Contrast Matrix WCAG 2.1 Contrast

F6F2CF
E7D58D
BDAA7F
886350
464236
—
1.3
Fail
2.0
Fail
4.7
AA
8.8
AAA
1.3
Fail
—
1.6
Fail
3.6
AA Large
6.8
AA
2.0
Fail
1.6
Fail
—
2.3
Fail
4.4
AA Large
4.7
AA
3.6
AA Large
2.3
Fail
—
1.9
Fail
8.8
AAA
6.8
AA
4.4
AA Large
1.9
Fail
—
White BG
1.1Fail
1.5Fail
2.3Fail
5.3AA
10.0AAA
Black BG
18.5AAA
14.3AAA
9.2AAA
3.9AA Large
2.1Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

F4F4D7
DFDF9E
B5B589
787855
444439

Deuteranopia

F5F5D9
E0E2A3
B6B78C
7A7D56
45453A

Tritanopia

F6DEE0
E6ACAF
BC9293
865859
463B3C

Achromatopsia

EFEFEF
D2D2D2
ABABAB
6C6C6C
424242

Shades & Tints Shades & Tints

#F6F2CF

Dark
Light

#E7D58D

Dark
Light

#BDAA7F

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6f2cf;
  --color-2: #e7d58d;
  --color-3: #bdaa7f;
  --color-4: #886350;
  --color-5: #464236;
}

SCSS

$color-1: #f6f2cf;
$color-2: #e7d58d;
$color-3: #bdaa7f;
$color-4: #886350;
$color-5: #464236;

TAILWIND

colors: {
  'brand-1': '#f6f2cf',
  'brand-2': '#e7d58d',
  'brand-3': '#bdaa7f',
  'brand-4': '#886350',
  'brand-5': '#464236',
}

RGB Array

[246, 242, 207], [231, 213, 141], [189, 170, 127], [136, 99, 80], [70, 66, 54]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6F2CF, #E7D58D, #BDAA7F, #886350, #464236 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: #f6f2cf; --color-2: #e7d58d; --color-3: #bdaa7f; --color-4: #886350; --color-5: #464236. 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