#B1E4D3 + #E1E3BE + #EBDAA6 + #FDC28A + #D2CB9F - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#B1E4D3

Jade · LightBlue · Glacier Blue

HEX

#B1E4D3

RGB

rgb(177, 228, 211)

HSL

hsl(160, 49%, 79%)

HSB

hsb(160, 22%, 89%)

CMYK

cmyk(22%, 0%, 7%, 11%)

Oklch

oklch(87.9% 0.058 172.5)

Traditional「Jade」· Paint「Glacier Blue」· Creative Arctic Pool

#E1E3BE

Fresh Green · Wheat · Lemon Cream

HEX

#E1E3BE

RGB

rgb(225, 227, 190)

HSL

hsl(63, 40%, 82%)

HSB

hsb(63, 16%, 89%)

CMYK

cmyk(1%, 0%, 16%, 11%)

Oklch

oklch(90.5% 0.049 109.9)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

#EBDAA6

Goose Yellow · Wheat · Lemon Cream

HEX

#EBDAA6

RGB

rgb(235, 218, 166)

HSL

hsl(45, 63%, 79%)

HSB

hsb(45, 29%, 92%)

CMYK

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

Oklch

oklch(89.0% 0.070 92.1)

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

#FDC28A

Apricot · BurlyWood · Peach Orange

HEX

#FDC28A

RGB

rgb(253, 194, 138)

HSL

hsl(29, 97%, 77%)

HSB

hsb(29, 45%, 99%)

CMYK

cmyk(0%, 23%, 45%, 1%)

Oklch

oklch(85.5% 0.099 64.4)

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

#D2CB9F

Fresh Green · Tan · Sunflower

HEX

#D2CB9F

RGB

rgb(210, 203, 159)

HSL

hsl(52, 36%, 72%)

HSB

hsb(52, 24%, 82%)

CMYK

cmyk(0%, 3%, 24%, 18%)

Oklch

oklch(83.7% 0.059 100.0)

Traditional「Fresh Green」· Paint「Sunflower」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

B1E4D3

E4AFC1

Analogous

AFE4B8

B1E4D3

AFDBE4

Triadic

B1E4D3

D2AFE4

E4D2AF

Split-Comp.

B1E4D3

E4AFDB

E4B8AF

Tetradic

B1E4D3

B8AFE4

E4AFC1

DBE4AF

Contrast Matrix WCAG 2.1 Contrast

B1E4D3	E1E3BE	EBDAA6	FDC28A	D2CB9F
—	1.1 Fail	1.0 Fail	1.1 Fail	1.2 Fail
1.1 Fail	—	1.1 Fail	1.2 Fail	1.2 Fail
1.0 Fail	1.1 Fail	—	1.1 Fail	1.2 Fail
1.1 Fail	1.2 Fail	1.1 Fail	—	1.0 Fail
1.2 Fail	1.2 Fail	1.2 Fail	1.0 Fail	—

White BG

1.4Fail

1.3Fail

1.4Fail

1.6Fail

Black BG

14.9AAA

15.9AAA

15.1AAA

13.3AAA

12.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C7C8D7

E2E2C7

E4E3B3

E3E398

CFCFAA

Deuteranopia

C4C0D8

E2E2C9

E5E6B6

E7EB9B

CFD0AC

Tritanopia

B4DADB

E1CED0

EABDBF

FAA2A5

D2B2B4

Achromatopsia

D3D3D3

DEDEDE

D9D9D9

CDCDCD

C8C8C8

Shades & Tints Shades & Tints

#B1E4D3

Dark

Light

#E1E3BE

Dark

Light

#EBDAA6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #b1e4d3;
  --color-2: #e1e3be;
  --color-3: #ebdaa6;
  --color-4: #fdc28a;
  --color-5: #d2cb9f;
}

SCSS

$color-1: #b1e4d3;
$color-2: #e1e3be;
$color-3: #ebdaa6;
$color-4: #fdc28a;
$color-5: #d2cb9f;

TAILWIND

colors: {
  'brand-1': '#b1e4d3',
  'brand-2': '#e1e3be',
  'brand-3': '#ebdaa6',
  'brand-4': '#fdc28a',
  'brand-5': '#d2cb9f',
}

RGB Array

[177, 228, 211], [225, 227, 190], [235, 218, 166], [253, 194, 138], [210, 203, 159]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #B1E4D3, #E1E3BE, #EBDAA6, #FDC28A, #D2CB9F 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: #b1e4d3; --color-2: #e1e3be; --color-3: #ebdaa6; --color-4: #fdc28a; --color-5: #d2cb9f. 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