#EBE6D8 + #BEE6DD + #AFDBD2 + #C4BEF7 + #AFD3DB - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#EBE6D8

Goose Yellow · Beige · Lemon Cream

HEX

#EBE6D8

RGB

rgb(235, 230, 216)

HSL

hsl(44, 32%, 88%)

HSB

hsb(44, 8%, 92%)

CMYK

cmyk(0%, 2%, 8%, 8%)

Oklch

oklch(92.5% 0.019 90.5)

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

#BEE6DD

Jade · LightBlue · Glacier Blue

HEX

#BEE6DD

RGB

rgb(190, 230, 221)

HSL

hsl(167, 44%, 82%)

HSB

hsb(167, 17%, 90%)

CMYK

cmyk(17%, 0%, 4%, 10%)

Oklch

oklch(89.4% 0.043 180.1)

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

#AFDBD2

Jade · LightBlue · Glacier Blue

HEX

#AFDBD2

RGB

rgb(175, 219, 210)

HSL

hsl(168, 38%, 77%)

HSB

hsb(168, 20%, 86%)

CMYK

cmyk(20%, 0%, 4%, 14%)

Oklch

oklch(85.8% 0.048 181.3)

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

#C4BEF7

Wisteria · LightSteelBlue · Sky Blue

HEX

#C4BEF7

RGB

rgb(196, 190, 247)

HSL

hsl(246, 78%, 86%)

HSB

hsb(246, 23%, 97%)

CMYK

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

Oklch

oklch(82.6% 0.080 289.4)

Traditional「Wisteria」· Paint「Sky Blue」· Creative Lavender Dream

#AFD3DB

Sky Blue · LightBlue · Glacier Blue

HEX

#AFD3DB

RGB

rgb(175, 211, 219)

HSL

hsl(191, 38%, 77%)

HSB

hsb(191, 20%, 86%)

CMYK

cmyk(20%, 4%, 0%, 14%)

Oklch

oklch(84.3% 0.040 212.7)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

EBE6D8

D7DCEA

Analogous

EADBD7

EBE6D8

E6EAD7

Triadic

EBE6D8

D7EAE5

E5D7EA

Split-Comp.

EBE6D8

D7E6EA

DBD7EA

Tetradic

EBE6D8

D7EADB

D7DCEA

EAD7E6

Contrast Matrix WCAG 2.1 Contrast

EBE6D8	BEE6DD	AFDBD2	C4BEF7	AFD3DB
—	1.1 Fail	1.2 Fail	1.4 Fail	1.3 Fail
1.1 Fail	—	1.1 Fail	1.3 Fail	1.2 Fail
1.2 Fail	1.1 Fail	—	1.2 Fail	1.1 Fail
1.4 Fail	1.3 Fail	1.2 Fail	—	1.1 Fail
1.3 Fail	1.2 Fail	1.1 Fail	1.1 Fail	—

White BG

1.2Fail

1.4Fail

1.5Fail

1.7Fail

1.6Fail

Black BG

16.8AAA

15.6AAA

13.9AAA

12.1AAA

13.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

E9E9DB

CFD0DF

C2C2D4

C1C1E9

BFBFD9

Deuteranopia

E9EADC

CDCAE0

C0BCD5

C2C2E6

BDBAD9

Tritanopia

EBDEDF

C0E1E1

B1D6D6

C4DEDC

B1D8D7

Achromatopsia

E6E6E6

D9D9D9

CDCDCD

C6C6C6

C9C9C9

Shades & Tints Shades & Tints

#EBE6D8

Dark

Light

#BEE6DD

Dark

Light

#AFDBD2

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #ebe6d8;
  --color-2: #bee6dd;
  --color-3: #afdbd2;
  --color-4: #c4bef7;
  --color-5: #afd3db;
}

SCSS

$color-1: #ebe6d8;
$color-2: #bee6dd;
$color-3: #afdbd2;
$color-4: #c4bef7;
$color-5: #afd3db;

TAILWIND

colors: {
  'brand-1': '#ebe6d8',
  'brand-2': '#bee6dd',
  'brand-3': '#afdbd2',
  'brand-4': '#c4bef7',
  'brand-5': '#afd3db',
}

RGB Array

[235, 230, 216], [190, 230, 221], [175, 219, 210], [196, 190, 247], [175, 211, 219]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #EBE6D8, #BEE6DD, #AFDBD2, #C4BEF7, #AFD3DB 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: #ebe6d8; --color-2: #bee6dd; --color-3: #afdbd2; --color-4: #c4bef7; --color-5: #afd3db. 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