#B5BFB0 + #BED0C0 + #C7E8CA + #F7DCC3 + #F8B59D · dark - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B5BFB0

Celadon · Silver · Apple Green

HEX

#B5BFB0

RGB

rgb(181, 191, 176)

HSL

hsl(100, 10%, 72%)

HSB

hsb(100, 8%, 75%)

CMYK

cmyk(5%, 0%, 8%, 25%)

Oklch

oklch(79.3% 0.024 135.0)

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

#BED0C0

Celadon · Silver · Apple Green

HEX

#BED0C0

RGB

rgb(190, 208, 192)

HSL

hsl(127, 16%, 78%)

HSB

hsb(127, 9%, 82%)

CMYK

cmyk(9%, 0%, 8%, 18%)

Oklch

oklch(83.9% 0.029 148.5)

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

#C7E8CA

Celadon · LightGray · Mint Green

HEX

#C7E8CA

RGB

rgb(199, 232, 202)

HSL

hsl(125, 42%, 85%)

HSB

hsb(125, 14%, 91%)

CMYK

cmyk(14%, 0%, 13%, 9%)

Oklch

oklch(89.9% 0.053 147.6)

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

#F7DCC3

Apricot · Bisque · Peach Orange

HEX

#F7DCC3

RGB

rgb(247, 220, 195)

HSL

hsl(29, 76%, 87%)

HSB

hsb(29, 21%, 97%)

CMYK

cmyk(0%, 11%, 21%, 3%)

Oklch

oklch(91.0% 0.045 65.0)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F8B59D

Apricot · BurlyWood · Peach Orange

HEX

#F8B59D

RGB

rgb(248, 181, 157)

HSL

hsl(16, 87%, 79%)

HSB

hsb(16, 37%, 97%)

CMYK

cmyk(0%, 27%, 37%, 3%)

Oklch

oklch(83.0% 0.085 40.6)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B5BFB0

BAB0BF

Analogous

BCBFB0

B5BFB0

B0BFB3

Triadic

B5BFB0

B0B5BF

BFB0B5

Split-Comp.

B5BFB0

B3B0BF

BFB0BC

Tetradic

B5BFB0

B0BCBF

BAB0BF

BFB3B0

Contrast Matrix WCAG 2.1 Contrast

B5BFB0	BED0C0	C7E8CA	F7DCC3	F8B59D
—	1.2 Fail	1.4 Fail	1.4 Fail	1.1 Fail
1.2 Fail	—	1.2 Fail	1.2 Fail	1.1 Fail
1.4 Fail	1.2 Fail	—	1.0 Fail	1.3 Fail
1.4 Fail	1.2 Fail	1.0 Fail	—	1.3 Fail
1.1 Fail	1.1 Fail	1.3 Fail	1.3 Fail	—

White BG

1.9Fail

1.6Fail

1.3Fail

1.7Fail

Black BG

11.0AAA

13.0AAA

15.8AAA

16.0AAA

12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B9B9B4

C6C6C4

D5D6D1

EBEBC9

DBDAA3

Deuteranopia

B9B8B5

C5C3C5

D3D1D3

EDEFCB

DFE4A4

Tritanopia

B6B6B7

BFC7C8

C9D7D8

F6CECF

F5A7A8

Achromatopsia

BABABA

C9C9C9

DBDBDB

E1E1E1

C6C6C6

Shades & Tints Shades & Tints

#B5BFB0

Dark

Light

#BED0C0

Dark

Light

#C7E8CA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b5bfb0;
  --color-2: #bed0c0;
  --color-3: #c7e8ca;
  --color-4: #f7dcc3;
  --color-5: #f8b59d;
}

SCSS

$color-1: #b5bfb0;
$color-2: #bed0c0;
$color-3: #c7e8ca;
$color-4: #f7dcc3;
$color-5: #f8b59d;

TAILWIND

colors: {
  'brand-1': '#b5bfb0',
  'brand-2': '#bed0c0',
  'brand-3': '#c7e8ca',
  'brand-4': '#f7dcc3',
  'brand-5': '#f8b59d',
}

RGB Array

[181, 191, 176], [190, 208, 192], [199, 232, 202], [247, 220, 195], [248, 181, 157]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This dark-style palette of #B5BFB0, #BED0C0, #C7E8CA, #F7DCC3, #F8B59D 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: #b5bfb0; --color-2: #bed0c0; --color-3: #c7e8ca; --color-4: #f7dcc3; --color-5: #f8b59d. 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 dark-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