← Back to Editor

#F2E6B2 · #A48F64 · #C47556 · #DFD071 · #2E2C13

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

#F2E6B2

Goose Yellow · Wheat · Lemon Cream

HEX
#F2E6B2
RGB
rgb(242, 230, 178)
HSL
hsl(49, 71%, 82%)
HSB
hsb(49, 26%, 95%)
CMYK
cmyk(0%, 5%, 26%, 5%)
Oklch
oklch(92.2% 0.068 96.6)

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

#A48F64

Ginger · Gray · Sunflower

HEX
#A48F64
RGB
rgb(164, 143, 100)
HSL
hsl(40, 26%, 52%)
HSB
hsb(40, 39%, 64%)
CMYK
cmyk(0%, 13%, 39%, 36%)
Oklch
oklch(65.8% 0.064 84.7)

Traditional「Ginger」· Paint「Sunflower」· Creative Blush Sunrise

#C47556

Tangerine · Chocolate · Warm Sun

HEX
#C47556
RGB
rgb(196, 117, 86)
HSL
hsl(17, 48%, 55%)
HSB
hsb(17, 56%, 77%)
CMYK
cmyk(0%, 40%, 56%, 23%)
Oklch
oklch(64.2% 0.109 42.0)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

#DFD071

Fresh Green · BurlyWood · Sunflower

HEX
#DFD071
RGB
rgb(223, 208, 113)
HSL
hsl(52, 63%, 66%)
HSB
hsb(52, 49%, 87%)
CMYK
cmyk(0%, 7%, 49%, 13%)
Oklch
oklch(85.0% 0.118 100.5)

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

#2E2C13

Autumn Sage · Black · Amber Gold

HEX
#2E2C13
RGB
rgb(46, 44, 19)
HSL
hsl(56, 42%, 13%)
HSB
hsb(56, 59%, 18%)
CMYK
cmyk(0%, 4%, 59%, 82%)
Oklch
oklch(28.8% 0.040 104.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F2E6B2
B1BCF2

Analogous

F2C5B1
F2E6B2
DDF2B1

Triadic

F2E6B2
B1F2E6
E6B1F2

Split-Comp.

F2E6B2
B1DDF2
C5B1F2

Tetradic

F2E6B2
B1F2C5
B1BCF2
F2B1DD

Contrast Matrix WCAG 2.1 Contrast

F2E6B2
A48F64
C47556
DFD071
2E2C13
—
2.5
Fail
2.8
Fail
1.2
Fail
11.3
AAA
2.5
Fail
—
1.1
Fail
2.0
Fail
4.5
AA
2.8
Fail
1.1
Fail
—
2.2
Fail
4.1
AA Large
1.2
Fail
2.0
Fail
2.2
Fail
—
9.0
AAA
11.3
AAA
4.5
AA
4.1
AA Large
9.0
AAA
—
White BG
1.3Fail
3.1AA Large
3.5AA Large
1.6Fail
14.1AAA
Black BG
16.7AAA
6.7AA
6.0AA
13.4AAA
1.5Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EDEDBF
9B9B6E
A2A15E
D9D888
2D2D19

Deuteranopia

EEEEC2
9C9E71
A6AC5F
D9DB8E
2D2D1B

Tritanopia

F1C9CB
A37778
C06365
DE9A9E
2E1E1F

Achromatopsia

E4E4E4
909090
898989
CACACA
2A2A2A

Shades & Tints Shades & Tints

#F2E6B2

Dark
Light

#A48F64

Dark
Light

#C47556

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f2e6b2;
  --color-2: #a48f64;
  --color-3: #c47556;
  --color-4: #dfd071;
  --color-5: #2e2c13;
}

SCSS

$color-1: #f2e6b2;
$color-2: #a48f64;
$color-3: #c47556;
$color-4: #dfd071;
$color-5: #2e2c13;

TAILWIND

colors: {
  'brand-1': '#f2e6b2',
  'brand-2': '#a48f64',
  'brand-3': '#c47556',
  'brand-4': '#dfd071',
  'brand-5': '#2e2c13',
}

RGB Array

[242, 230, 178], [164, 143, 100], [196, 117, 86], [223, 208, 113], [46, 44, 19]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F2E6B2, #A48F64, #C47556, #DFD071, #2E2C13 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: #f2e6b2; --color-2: #a48f64; --color-3: #c47556; --color-4: #dfd071; --color-5: #2e2c13. 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