#F6D2BB + #EFE6C4 + #BCC3B2 + #9E9585 + #90766A - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#F6D2BB

Apricot · Wheat · Peach Orange

HEX

#F6D2BB

RGB

rgb(246, 210, 187)

HSL

hsl(23, 77%, 85%)

HSB

hsb(23, 24%, 96%)

CMYK

cmyk(0%, 15%, 24%, 4%)

Oklch

oklch(88.8% 0.051 54.5)

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

#EFE6C4

Goose Yellow · Bisque · Lemon Cream

HEX

#EFE6C4

RGB

rgb(239, 230, 196)

HSL

hsl(47, 57%, 85%)

HSB

hsb(47, 18%, 94%)

CMYK

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

Oklch

oklch(92.3% 0.046 94.9)

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

#BCC3B2

Willow Green · Silver · Apple Green

HEX

#BCC3B2

RGB

rgb(188, 195, 178)

HSL

hsl(85, 12%, 73%)

HSB

hsb(85, 9%, 76%)

CMYK

cmyk(4%, 0%, 9%, 24%)

Oklch

oklch(80.7% 0.025 125.3)

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

#9E9585

Ginger · Gray · Warm Sun

HEX

#9E9585

RGB

rgb(158, 149, 133)

HSL

hsl(38, 11%, 57%)

HSB

hsb(38, 16%, 62%)

CMYK

cmyk(0%, 6%, 16%, 38%)

Oklch

oklch(67.3% 0.025 82.1)

Traditional「Ginger」· Paint「Warm Sun」· Creative Blush Sunrise

#90766A

Tangerine · Gray · Amber Brown

HEX

#90766A

RGB

rgb(144, 118, 106)

HSL

hsl(19, 15%, 49%)

HSB

hsb(19, 26%, 56%)

CMYK

cmyk(0%, 18%, 26%, 44%)

Oklch

oklch(58.7% 0.037 46.1)

Traditional「Tangerine」· Paint「Amber Brown」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

F6D2BB

BBE0F6

Analogous

F6BBC2

F6D2BB

F6EFBB

Triadic

F6D2BB

BBF6D2

D2BBF6

Split-Comp.

F6D2BB

BBF6EF

BBC2F6

Tetradic

F6D2BB

C2F6BB

BBE0F6

EFBBF6

Contrast Matrix WCAG 2.1 Contrast

F6D2BB	EFE6C4	BCC3B2	9E9585	90766A
—	1.1 Fail	1.3 Fail	2.1 Fail	3.0 Fail
1.1 Fail	—	1.4 Fail	2.4 Fail	3.4 AA Large
1.3 Fail	1.4 Fail	—	1.6 Fail	2.3 Fail
2.1 Fail	2.4 Fail	1.6 Fail	—	1.4 Fail
3.0 Fail	3.4 AA Large	2.3 Fail	1.4 Fail	—

White BG

1.4Fail

1.3Fail

1.8Fail

3.0Fail

4.2AA Large

Black BG

14.9AAA

16.8AAA

11.6AAA

7.1AAA

5.0AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E6E6C1

EBEBCC

BFBFB6

9A9A89

85856D

Deuteranopia

E9EBC2

ECECCE

BFBEB7

9B9B8A

86886E

Tritanopia

F4C5C6

EFD3D4

BCB9BA

9E8C8D

8F6F70

Achromatopsia

DADADA

E5E5E5

BFBFBF

969696

7C7C7C

Shades & Tints Shades & Tints

#F6D2BB

Dark

Light

#EFE6C4

Dark

Light

#BCC3B2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #f6d2bb;
  --color-2: #efe6c4;
  --color-3: #bcc3b2;
  --color-4: #9e9585;
  --color-5: #90766a;
}

SCSS

$color-1: #f6d2bb;
$color-2: #efe6c4;
$color-3: #bcc3b2;
$color-4: #9e9585;
$color-5: #90766a;

TAILWIND

colors: {
  'brand-1': '#f6d2bb',
  'brand-2': '#efe6c4',
  'brand-3': '#bcc3b2',
  'brand-4': '#9e9585',
  'brand-5': '#90766a',
}

RGB Array

[246, 210, 187], [239, 230, 196], [188, 195, 178], [158, 149, 133], [144, 118, 106]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #F6D2BB, #EFE6C4, #BCC3B2, #9E9585, #90766A 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: #f6d2bb; --color-2: #efe6c4; --color-3: #bcc3b2; --color-4: #9e9585; --color-5: #90766a. 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