#B6D4BB + #F1E7C5 + #F0CDAB + #F0B098 + #EEA8A7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B6D4BB

Celadon · Silver · Apple Green

HEX

#B6D4BB

RGB

rgb(182, 212, 187)

HSL

hsl(130, 26%, 77%)

HSB

hsb(130, 14%, 83%)

CMYK

cmyk(14%, 0%, 12%, 17%)

Oklch

oklch(84.1% 0.047 150.0)

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

#F1E7C5

Goose Yellow · Bisque · Lemon Cream

HEX

#F1E7C5

RGB

rgb(241, 231, 197)

HSL

hsl(46, 61%, 86%)

HSB

hsb(46, 18%, 95%)

CMYK

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

Oklch

oklch(92.7% 0.046 93.5)

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

#F0CDAB

Goose Yellow · Wheat · Peach Orange

HEX

#F0CDAB

RGB

rgb(240, 205, 171)

HSL

hsl(30, 70%, 81%)

HSB

hsb(30, 29%, 94%)

CMYK

cmyk(0%, 15%, 29%, 6%)

Oklch

oklch(87.0% 0.060 66.1)

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

#F0B098

Apricot · BurlyWood · Peach Orange

HEX

#F0B098

RGB

rgb(240, 176, 152)

HSL

hsl(16, 75%, 77%)

HSB

hsb(16, 37%, 94%)

CMYK

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

Oklch

oklch(81.1% 0.082 41.4)

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

#EEA8A7

Peach Pink · LightPink · Coral Red

HEX

#EEA8A7

RGB

rgb(238, 168, 167)

HSL

hsl(1, 68%, 79%)

HSB

hsb(1, 30%, 93%)

CMYK

cmyk(0%, 29%, 30%, 7%)

Oklch

oklch(79.8% 0.083 20.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B6D4BB

D4B5CF

Analogous

BFD4B5

B6D4BB

B5D4C9

Triadic

B6D4BB

BAB5D4

D4BAB5

Split-Comp.

B6D4BB

C9B5D4

D4B5BF

Tetradic

B6D4BB

B5BFD4

D4B5CF

D4C9B5

Contrast Matrix WCAG 2.1 Contrast

B6D4BB	F1E7C5	F0CDAB	F0B098	EEA8A7
—	1.3 Fail	1.1 Fail	1.2 Fail	1.2 Fail
1.3 Fail	—	1.2 Fail	1.5 Fail	1.6 Fail
1.1 Fail	1.2 Fail	—	1.2 Fail	1.3 Fail
1.2 Fail	1.5 Fail	1.2 Fail	—	1.1 Fail
1.2 Fail	1.6 Fail	1.3 Fail	1.1 Fail	—

White BG

1.6Fail

1.2Fail

1.5Fail

1.8Fail

1.9Fail

Black BG

13.1AAA

17.0AAA

14.0AAA

11.4AAA

10.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C3C3C1

EDEDCD

E1E1B3

D4D49E

D0CFA7

Deuteranopia

C1BFC3

EDEECF

E3E6B5

D8DD9F

D4D9A7

Tritanopia

B8C6C7

F1D4D5

EEBABB

EDA2A3

EBA7A7

Achromatopsia

C8C8C8

E6E6E6

D4D4D4

C0C0C0

BDBDBD

Shades & Tints Shades & Tints

#B6D4BB

Dark

Light

#F1E7C5

Dark

Light

#F0CDAB

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b6d4bb;
  --color-2: #f1e7c5;
  --color-3: #f0cdab;
  --color-4: #f0b098;
  --color-5: #eea8a7;
}

SCSS

$color-1: #b6d4bb;
$color-2: #f1e7c5;
$color-3: #f0cdab;
$color-4: #f0b098;
$color-5: #eea8a7;

TAILWIND

colors: {
  'brand-1': '#b6d4bb',
  'brand-2': '#f1e7c5',
  'brand-3': '#f0cdab',
  'brand-4': '#f0b098',
  'brand-5': '#eea8a7',
}

RGB Array

[182, 212, 187], [241, 231, 197], [240, 205, 171], [240, 176, 152], [238, 168, 167]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B6D4BB, #F1E7C5, #F0CDAB, #F0B098, #EEA8A7 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: #b6d4bb; --color-2: #f1e7c5; --color-3: #f0cdab; --color-4: #f0b098; --color-5: #eea8a7. 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