#B1B6A0 + #D0C8A3 + #FFD193 + #F6AF83 + #E48E75 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B1B6A0

Willow Green · DarkGray · Apple Green

HEX

#B1B6A0

RGB

rgb(177, 182, 160)

HSL

hsl(74, 13%, 67%)

HSB

hsb(74, 12%, 71%)

CMYK

cmyk(3%, 0%, 12%, 29%)

Oklch

oklch(76.6% 0.031 117.5)

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

#D0C8A3

Goose Yellow · Tan · Sunflower

HEX

#D0C8A3

RGB

rgb(208, 200, 163)

HSL

hsl(49, 32%, 73%)

HSB

hsb(49, 22%, 82%)

CMYK

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

Oklch

oklch(83.0% 0.050 97.2)

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

#FFD193

Goose Yellow · Khaki · Peach Orange

HEX

#FFD193

RGB

rgb(255, 209, 147)

HSL

hsl(34, 100%, 79%)

HSB

hsb(34, 42%, 100%)

CMYK

cmyk(0%, 18%, 42%, 0%)

Oklch

oklch(88.7% 0.094 74.4)

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

#F6AF83

Apricot · LightSalmon · Warm Sun

HEX

#F6AF83

RGB

rgb(246, 175, 131)

HSL

hsl(23, 86%, 74%)

HSB

hsb(23, 47%, 96%)

CMYK

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

Oklch

oklch(81.1% 0.102 52.6)

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

#E48E75

Peach Pink · DarkSalmon · Coral Red

HEX

#E48E75

RGB

rgb(228, 142, 117)

HSL

hsl(14, 67%, 68%)

HSB

hsb(14, 49%, 89%)

CMYK

cmyk(0%, 38%, 49%, 11%)

Oklch

oklch(73.0% 0.111 37.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B1B6A0

A5A0B6

Analogous

B6B0A0

B1B6A0

A6B6A0

Triadic

B1B6A0

A0B1B6

B6A0B1

Split-Comp.

B1B6A0

A0A6B6

B0A0B6

Tetradic

B1B6A0

A0B6B0

A5A0B6

B6A0A6

Contrast Matrix WCAG 2.1 Contrast

B1B6A0	D0C8A3	FFD193	F6AF83	E48E75
—	1.2 Fail	1.5 Fail	1.1 Fail	1.2 Fail
1.2 Fail	—	1.2 Fail	1.1 Fail	1.5 Fail
1.5 Fail	1.2 Fail	—	1.3 Fail	1.8 Fail
1.1 Fail	1.1 Fail	1.3 Fail	—	1.4 Fail
1.2 Fail	1.5 Fail	1.8 Fail	1.4 Fail	—

White BG

2.1Fail

1.7Fail

1.4Fail

1.8Fail

2.5Fail

Black BG

10.1AAA

12.5AAA

14.8AAA

11.4AAA

8.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B3B3A5

CDCCAC

EBEBA2

D7D78E

BFBE7B

Deuteranopia

B3B3A7

CDCEAE

EEF1A6

DBE190

C4CA7D

Tritanopia

B1AAAA

D0B3B5

FDAEB0

F29698

E08081

Achromatopsia

B2B2B2

C6C6C6

D8D8D8

BFBFBF

A5A5A5

Shades & Tints Shades & Tints

#B1B6A0

Dark

Light

#D0C8A3

Dark

Light

#FFD193

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b1b6a0;
  --color-2: #d0c8a3;
  --color-3: #ffd193;
  --color-4: #f6af83;
  --color-5: #e48e75;
}

SCSS

$color-1: #b1b6a0;
$color-2: #d0c8a3;
$color-3: #ffd193;
$color-4: #f6af83;
$color-5: #e48e75;

TAILWIND

colors: {
  'brand-1': '#b1b6a0',
  'brand-2': '#d0c8a3',
  'brand-3': '#ffd193',
  'brand-4': '#f6af83',
  'brand-5': '#e48e75',
}

RGB Array

[177, 182, 160], [208, 200, 163], [255, 209, 147], [246, 175, 131], [228, 142, 117]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B1B6A0, #D0C8A3, #FFD193, #F6AF83, #E48E75 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: #b1b6a0; --color-2: #d0c8a3; --color-3: #ffd193; --color-4: #f6af83; --color-5: #e48e75. 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