← Back to Editor

#BEB896 · #CBAE8C · #F49E7B · #352B21 · #8EBC9F

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

#BEB896

Fresh Green · Tan · Sunflower

HEX
#BEB896
RGB
rgb(190, 184, 150)
HSL
hsl(51, 24%, 67%)
HSB
hsb(51, 21%, 75%)
CMYK
cmyk(0%, 3%, 21%, 25%)
Oklch
oklch(77.9% 0.047 99.1)

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

#CBAE8C

Ginger · Tan · Warm Sun

HEX
#CBAE8C
RGB
rgb(203, 174, 140)
HSL
hsl(32, 38%, 67%)
HSB
hsb(32, 31%, 80%)
CMYK
cmyk(0%, 14%, 31%, 20%)
Oklch
oklch(76.8% 0.057 71.3)

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

#F49E7B

Apricot · LightSalmon · Warm Sun

HEX
#F49E7B
RGB
rgb(244, 158, 123)
HSL
hsl(17, 85%, 72%)
HSB
hsb(17, 50%, 96%)
CMYK
cmyk(0%, 35%, 50%, 4%)
Oklch
oklch(77.8% 0.114 42.8)

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

#352B21

Ochre · DarkSlateGray · Cinnamon

HEX
#352B21
RGB
rgb(53, 43, 33)
HSL
hsl(30, 23%, 17%)
HSB
hsb(30, 38%, 21%)
CMYK
cmyk(0%, 19%, 38%, 79%)
Oklch
oklch(29.7% 0.023 66.8)

Traditional「Ochre」· Paint「Cinnamon」· Creative Blush Sunrise

#8EBC9F

Celadon · DarkSeaGreen · Apple Green

HEX
#8EBC9F
RGB
rgb(142, 188, 159)
HSL
hsl(142, 26%, 65%)
HSB
hsb(142, 24%, 74%)
CMYK
cmyk(24%, 0%, 15%, 26%)
Oklch
oklch(75.4% 0.064 156.8)

Traditional「Celadon」· Paint「Apple Green」· Creative Mint Breeze

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

BEB896
979DBF

Analogous

BFA597
BEB896
B1BF97

Triadic

BEB896
97BFB9
B997BF

Split-Comp.

BEB896
97B1BF
A597BF

Tetradic

BEB896
97BFA5
979DBF
BF97B1

Contrast Matrix WCAG 2.1 Contrast

BEB896
CBAE8C
F49E7B
352B21
8EBC9F
—
1.1
Fail
1.0
Fail
6.9
AA
1.1
Fail
1.1
Fail
—
1.0
Fail
6.6
AA
1.0
Fail
1.0
Fail
1.0
Fail
—
6.6
AA
1.0
Fail
6.9
AA
6.6
AA
6.6
AA
—
6.5
AA
1.1
Fail
1.0
Fail
1.0
Fail
6.5
AA
—
White BG
2.0Fail
2.1Fail
2.1Fail
13.8AAA
2.1Fail
Black BG
10.5AAA
10.0AAA
10.0AAA
1.5Fail
9.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BBBB9E
BEBE94
CFCE83
313123
A2A2A6

Deuteranopia

BCBCA0
C0C296
D4DA86
313224
9F9CA8

Tritanopia

BEA5A6
CA9B9C
F08A8C
342526
90ACAD

Achromatopsia

B6B6B6
B3B3B3
B4B4B4
2D2D2D
ABABAB

Shades & Tints Shades & Tints

#BEB896

Dark
Light

#CBAE8C

Dark
Light

#F49E7B

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #beb896;
  --color-2: #cbae8c;
  --color-3: #f49e7b;
  --color-4: #352b21;
  --color-5: #8ebc9f;
}

SCSS

$color-1: #beb896;
$color-2: #cbae8c;
$color-3: #f49e7b;
$color-4: #352b21;
$color-5: #8ebc9f;

TAILWIND

colors: {
  'brand-1': '#beb896',
  'brand-2': '#cbae8c',
  'brand-3': '#f49e7b',
  'brand-4': '#352b21',
  'brand-5': '#8ebc9f',
}

RGB Array

[190, 184, 150], [203, 174, 140], [244, 158, 123], [53, 43, 33], [142, 188, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #BEB896, #CBAE8C, #F49E7B, #352B21, #8EBC9F 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: #beb896; --color-2: #cbae8c; --color-3: #f49e7b; --color-4: #352b21; --color-5: #8ebc9f. 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