#837B79 + #B08072 + #E8996E + #F5C283 + #F4EFC7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#837B79

Ink Gray · Gray · Warm Gray

HEX

#837B79

RGB

rgb(131, 123, 121)

HSL

hsl(12, 4%, 49%)

HSB

hsb(12, 8%, 51%)

CMYK

cmyk(0%, 6%, 8%, 49%)

Oklch

oklch(58.9% 0.010 34.3)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#B08072

Crimson · Gray · Passion Red

HEX

#B08072

RGB

rgb(176, 128, 114)

HSL

hsl(14, 28%, 57%)

HSB

hsb(14, 35%, 69%)

CMYK

cmyk(0%, 27%, 35%, 31%)

Oklch

oklch(64.4% 0.064 36.9)

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

#E8996E

Apricot · DarkSalmon · Warm Sun

HEX

#E8996E

RGB

rgb(232, 153, 110)

HSL

hsl(21, 73%, 67%)

HSB

hsb(21, 53%, 91%)

CMYK

cmyk(0%, 34%, 53%, 9%)

Oklch

oklch(75.3% 0.111 49.0)

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

#F5C283

Goose Yellow · BurlyWood · Warm Sun

HEX

#F5C283

RGB

rgb(245, 194, 131)

HSL

hsl(33, 85%, 74%)

HSB

hsb(33, 47%, 96%)

CMYK

cmyk(0%, 21%, 47%, 4%)

Oklch

oklch(84.6% 0.099 71.7)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

#F4EFC7

Fresh Green · Bisque · Lemon Cream

HEX

#F4EFC7

RGB

rgb(244, 239, 199)

HSL

hsl(53, 67%, 87%)

HSB

hsb(53, 18%, 96%)

CMYK

cmyk(0%, 2%, 18%, 4%)

Oklch

oklch(94.6% 0.052 101.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

837B79

788082

Analogous

82787B

837B79

827F78

Triadic

837B79

78827A

7A7882

Split-Comp.

837B79

78827F

787B82

Tetradic

837B79

7B8278

788082

7F7882

Contrast Matrix WCAG 2.1 Contrast

837B79	B08072	E8996E	F5C283	F4EFC7
—	1.2 Fail	1.8 Fail	2.5 Fail	3.6 AA Large
1.2 Fail	—	1.5 Fail	2.1 Fail	2.9 Fail
1.8 Fail	1.5 Fail	—	1.4 Fail	2.0 Fail
2.5 Fail	2.1 Fail	1.4 Fail	—	1.4 Fail
3.6 AA Large	2.9 Fail	2.0 Fail	1.4 Fail	—

White BG

4.1AA Large

3.4AA Large

2.3Fail

1.6Fail

1.2Fail

Black BG

5.1AA

6.2AA

9.2AAA

12.9AAA

18.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

807F79

9B9B75

C6C578

DFDE92

F2F2D1

Deuteranopia

80817A

9EA276

CAD07B

E2E696

F2F3D3

Tritanopia

837A7A

AE7879

E48182

F29EA1

F4D8DA

Achromatopsia

7D7D7D

8D8D8D

ACACAC

CACACA

ECECEC

Shades & Tints Shades & Tints

#837B79

Dark

Light

#B08072

Dark

Light

#E8996E

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #837b79;
  --color-2: #b08072;
  --color-3: #e8996e;
  --color-4: #f5c283;
  --color-5: #f4efc7;
}

SCSS

$color-1: #837b79;
$color-2: #b08072;
$color-3: #e8996e;
$color-4: #f5c283;
$color-5: #f4efc7;

TAILWIND

colors: {
  'brand-1': '#837b79',
  'brand-2': '#b08072',
  'brand-3': '#e8996e',
  'brand-4': '#f5c283',
  'brand-5': '#f4efc7',
}

RGB Array

[131, 123, 121], [176, 128, 114], [232, 153, 110], [245, 194, 131], [244, 239, 199]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #837B79, #B08072, #E8996E, #F5C283, #F4EFC7 is ideal for: health products, baby brands, fresh-style blogs. 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: #837b79; --color-2: #b08072; --color-3: #e8996e; --color-4: #f5c283; --color-5: #f4efc7. 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. 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