← Back to Editor

#F0EDC1 · #B8B58B · #6E6E5E · #515246 · #7A3831

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

#F0EDC1

Fresh Green · Bisque · Lemon Cream

HEX
#F0EDC1
RGB
rgb(240, 237, 193)
HSL
hsl(56, 61%, 85%)
HSB
hsb(56, 20%, 94%)
CMYK
cmyk(0%, 1%, 20%, 6%)
Oklch
oklch(93.7% 0.057 104.2)

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

#B8B58B

Fresh Green · Tan · Sunflower

HEX
#B8B58B
RGB
rgb(184, 181, 139)
HSL
hsl(56, 24%, 63%)
HSB
hsb(56, 24%, 72%)
CMYK
cmyk(0%, 2%, 24%, 28%)
Oklch
oklch(76.5% 0.057 104.3)

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

#6E6E5E

Autumn Sage · DimGray · Charcoal

HEX
#6E6E5E
RGB
rgb(110, 110, 94)
HSL
hsl(60, 8%, 40%)
HSB
hsb(60, 15%, 43%)
CMYK
cmyk(0%, 0%, 15%, 57%)
Oklch
oklch(53.3% 0.024 107.2)

Traditional「Autumn Sage」· Paint「Charcoal」· Creative Midnight Shadow

#515246

Autumn Sage · DarkOliveGreen · Charcoal

HEX
#515246
RGB
rgb(81, 82, 70)
HSL
hsl(65, 8%, 30%)
HSB
hsb(65, 15%, 32%)
CMYK
cmyk(1%, 0%, 15%, 68%)
Oklch
oklch(43.4% 0.019 111.1)

Traditional「Autumn Sage」· Paint「Charcoal」· Creative Midnight Shadow

#7A3831

Crimson · Brown · Wine Red

HEX
#7A3831
RGB
rgb(122, 56, 49)
HSL
hsl(6, 43%, 34%)
HSB
hsb(6, 60%, 48%)
CMYK
cmyk(0%, 54%, 60%, 52%)
Oklch
oklch(42.7% 0.094 27.8)

Traditional「Crimson」· Paint「Wine Red」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F0EDC1
C1C5F0

Analogous

F0D6C1
F0EDC1
DCF0C1

Triadic

F0EDC1
C1F0ED
EDC1F0

Split-Comp.

F0EDC1
C1DCF0
D6C1F0

Tetradic

F0EDC1
C1F0D6
C1C5F0
F0C1DC

Contrast Matrix WCAG 2.1 Contrast

F0EDC1
B8B58B
6E6E5E
515246
7A3831
—
1.8
Fail
4.3
AA Large
6.6
AA
7.2
AAA
1.8
Fail
—
2.5
Fail
3.8
AA Large
4.1
AA Large
4.3
AA Large
2.5
Fail
—
1.5
Fail
1.7
Fail
6.6
AA
3.8
AA Large
1.5
Fail
—
1.1
Fail
7.2
AAA
4.1
AA Large
1.7
Fail
1.1
Fail
—
White BG
1.2Fail
2.1Fail
5.2AA
7.9AAA
8.6AAA
Black BG
17.6AAA
10.0AAA
4.1AA Large
2.6Fail
2.4Fail

Color Blindness Simulation Color Blindness Simulation

Protanopia

EFEFCC
B7B795
6E6E62
515149
5D5D33

Deuteranopia

EFEFCE
B7B798
6E6E63
51514A
616633

Tritanopia

F0D4D6
B89D9F
6E6566
514B4C
773434

Achromatopsia

E9E9E9
B1B1B1
6C6C6C
505050
4B4B4B

Shades & Tints Shades & Tints

#F0EDC1

Dark
Light

#B8B58B

Dark
Light

#6E6E5E

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f0edc1;
  --color-2: #b8b58b;
  --color-3: #6e6e5e;
  --color-4: #515246;
  --color-5: #7a3831;
}

SCSS

$color-1: #f0edc1;
$color-2: #b8b58b;
$color-3: #6e6e5e;
$color-4: #515246;
$color-5: #7a3831;

TAILWIND

colors: {
  'brand-1': '#f0edc1',
  'brand-2': '#b8b58b',
  'brand-3': '#6e6e5e',
  'brand-4': '#515246',
  'brand-5': '#7a3831',
}

RGB Array

[240, 237, 193], [184, 181, 139], [110, 110, 94], [81, 82, 70], [122, 56, 49]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F0EDC1, #B8B58B, #6E6E5E, #515246, #7A3831 is ideal for: brand design, premium product pages, magazine layouts, infographics, data visualization, accessible design. Low-saturation colors convey a sophisticated, premium feel. High contrast ensures clear visual hierarchy and readability. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #f0edc1; --color-2: #b8b58b; --color-3: #6e6e5e; --color-4: #515246; --color-5: #7a3831. 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. Restrained colors convey professionalism and trust. 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