#826368 + #B8928A + #F0C79B + #F1E1AD + #BCAA96 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#826368

Crimson · DimGray · Passion Red

HEX

#826368

RGB

rgb(130, 99, 104)

HSL

hsl(350, 14%, 45%)

HSB

hsb(350, 24%, 51%)

CMYK

cmyk(0%, 24%, 20%, 49%)

Oklch

oklch(53.2% 0.041 7.8)

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

#B8928A

Peach Pink · DarkGray · Coral Red

HEX

#B8928A

RGB

rgb(184, 146, 138)

HSL

hsl(10, 24%, 63%)

HSB

hsb(10, 25%, 72%)

CMYK

cmyk(0%, 21%, 25%, 28%)

Oklch

oklch(69.3% 0.048 32.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#F0C79B

Goose Yellow · BurlyWood · Peach Orange

HEX

#F0C79B

RGB

rgb(240, 199, 155)

HSL

hsl(31, 74%, 77%)

HSB

hsb(31, 35%, 94%)

CMYK

cmyk(0%, 17%, 35%, 6%)

Oklch

oklch(85.5% 0.074 68.6)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#F1E1AD

Goose Yellow · Wheat · Lemon Cream

HEX

#F1E1AD

RGB

rgb(241, 225, 173)

HSL

hsl(46, 71%, 81%)

HSB

hsb(46, 28%, 95%)

CMYK

cmyk(0%, 7%, 28%, 5%)

Oklch

oklch(91.0% 0.069 93.0)

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

#BCAA96

Ginger · Tan · Warm Sun

HEX

#BCAA96

RGB

rgb(188, 170, 150)

HSL

hsl(32, 22%, 66%)

HSB

hsb(32, 20%, 74%)

CMYK

cmyk(0%, 10%, 20%, 26%)

Oklch

oklch(74.8% 0.035 70.2)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

826368

63837D

Analogous

836378

826368

836D63

Triadic

826368

688363

636883

Split-Comp.

826368

63836D

637883

Tetradic

826368

788363

63837D

6D6383

Contrast Matrix WCAG 2.1 Contrast

826368	B8928A	F0C79B	F1E1AD	BCAA96
—	1.9 Fail	3.4 AA Large	4.1 AA Large	2.4 Fail
1.9 Fail	—	1.8 Fail	2.1 Fail	1.2 Fail
3.4 AA Large	1.8 Fail	—	1.2 Fail	1.4 Fail
4.1 AA Large	2.1 Fail	1.2 Fail	—	1.7 Fail
2.4 Fail	1.2 Fail	1.4 Fail	1.7 Fail	—

White BG

5.3AA

2.8Fail

1.6Fail

1.3Fail

2.3Fail

Black BG

3.9AA Large

7.5AAA

13.3AAA

16.1AAA

9.3AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

757467

A8A78C

DEDEA6

EAEABA

B4B49B

Deuteranopia

767967

AAAD8C

E1E4A8

EBECBD

B5B79C

Tritanopia

806666

B68D8E

EEAEB0

F0C4C6

BB9FA0

Achromatopsia

6D6D6D

9C9C9C

CECECE

E0E0E0

ADADAD

Shades & Tints Shades & Tints

#826368

Dark

Light

#B8928A

Dark

Light

#F0C79B

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #826368;
  --color-2: #b8928a;
  --color-3: #f0c79b;
  --color-4: #f1e1ad;
  --color-5: #bcaa96;
}

SCSS

$color-1: #826368;
$color-2: #b8928a;
$color-3: #f0c79b;
$color-4: #f1e1ad;
$color-5: #bcaa96;

TAILWIND

colors: {
  'brand-1': '#826368',
  'brand-2': '#b8928a',
  'brand-3': '#f0c79b',
  'brand-4': '#f1e1ad',
  'brand-5': '#bcaa96',
}

RGB Array

[130, 99, 104], [184, 146, 138], [240, 199, 155], [241, 225, 173], [188, 170, 150]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #826368, #B8928A, #F0C79B, #F1E1AD, #BCAA96 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: #826368; --color-2: #b8928a; --color-3: #f0c79b; --color-4: #f1e1ad; --color-5: #bcaa96. 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