#EFE7D4 + #DFCF91 + #F19D5F + #B1C1A6 + #959283 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarm

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EFE7D4

Goose Yellow · Beige · Lemon Cream

HEX

#EFE7D4

RGB

rgb(239, 231, 212)

HSL

hsl(42, 46%, 88%)

HSB

hsb(42, 11%, 94%)

CMYK

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

Oklch

oklch(92.9% 0.027 87.9)

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

#DFCF91

Goose Yellow · BurlyWood · Sunflower

HEX

#DFCF91

RGB

rgb(223, 207, 145)

HSL

hsl(48, 55%, 72%)

HSB

hsb(48, 35%, 87%)

CMYK

cmyk(0%, 7%, 35%, 13%)

Oklch

oklch(85.3% 0.082 95.4)

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

#F19D5F

Apricot · SandyBrown · Warm Sun

HEX

#F19D5F

RGB

rgb(241, 157, 95)

HSL

hsl(25, 84%, 66%)

HSB

hsb(25, 61%, 95%)

CMYK

cmyk(0%, 35%, 61%, 5%)

Oklch

oklch(76.8% 0.127 55.9)

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

#B1C1A6

Celadon · DarkGray · Apple Green

HEX

#B1C1A6

RGB

rgb(177, 193, 166)

HSL

hsl(96, 18%, 70%)

HSB

hsb(96, 14%, 76%)

CMYK

cmyk(8%, 0%, 14%, 24%)

Oklch

oklch(79.1% 0.041 132.5)

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

#959283

Autumn Sage · Gray · Warm Gray

HEX

#959283

RGB

rgb(149, 146, 131)

HSL

hsl(50, 8%, 55%)

HSB

hsb(50, 12%, 58%)

CMYK

cmyk(0%, 2%, 12%, 42%)

Oklch

oklch(65.8% 0.022 97.7)

Traditional「Autumn Sage」· Paint「Warm Gray」· Creative Urban Concrete

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EFE7D4

D2DBEE

Analogous

EED8D2

EFE7D4

E9EED2

Triadic

EFE7D4

D2EEE6

E6D2EE

Split-Comp.

EFE7D4

D2E9EE

D8D2EE

Tetradic

EFE7D4

D2EED8

D2DBEE

EED2E9

Contrast Matrix WCAG 2.1 Contrast

EFE7D4	DFCF91	F19D5F	B1C1A6	959283
—	1.3 Fail	1.8 Fail	1.5 Fail	2.5 Fail
1.3 Fail	—	1.4 Fail	1.2 Fail	2.0 Fail
1.8 Fail	1.4 Fail	—	1.1 Fail	1.4 Fail
1.5 Fail	1.2 Fail	1.1 Fail	—	1.6 Fail
2.5 Fail	2.0 Fail	1.4 Fail	1.6 Fail	—

White BG

1.2Fail

1.6Fail

2.2Fail

1.9Fail

3.1AA Large

Black BG

17.1AAA

13.5AAA

9.7AAA

11.0AAA

6.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

ECEBD9

D8D8A0

CDCC6E

B8B8AD

949487

Deuteranopia

ECEDDA

D9DAA4

D2D872

B7B6AE

949488

Tritanopia

EFDCDD

DEACAE

ED7A7C

B2B2B3

95898A

Achromatopsia

E7E7E7

CDCDCD

AFAFAF

B9B9B9

919191

Shades & Tints Shades & Tints

#EFE7D4

Dark

Light

#DFCF91

Dark

Light

#F19D5F

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #efe7d4;
  --color-2: #dfcf91;
  --color-3: #f19d5f;
  --color-4: #b1c1a6;
  --color-5: #959283;
}

SCSS

$color-1: #efe7d4;
$color-2: #dfcf91;
$color-3: #f19d5f;
$color-4: #b1c1a6;
$color-5: #959283;

TAILWIND

colors: {
  'brand-1': '#efe7d4',
  'brand-2': '#dfcf91',
  'brand-3': '#f19d5f',
  'brand-4': '#b1c1a6',
  'brand-5': '#959283',
}

RGB Array

[239, 231, 212], [223, 207, 145], [241, 157, 95], [177, 193, 166], [149, 146, 131]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EFE7D4, #DFCF91, #F19D5F, #B1C1A6, #959283 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: #efe7d4; --color-2: #dfcf91; --color-3: #f19d5f; --color-4: #b1c1a6; --color-5: #959283. 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