#A3EFD8 + #A7DDC8 + #B1D1C0 + #B99F95 + #EEB7B5 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A3EFD8

Jade · LightBlue · Glacier Blue

HEX

#A3EFD8

RGB

rgb(163, 239, 216)

HSL

hsl(162, 70%, 79%)

HSB

hsb(162, 32%, 94%)

CMYK

cmyk(32%, 0%, 10%, 6%)

Oklch

oklch(89.6% 0.082 173.5)

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

#A7DDC8

Jade · LightBlue · Apple Green

HEX

#A7DDC8

RGB

rgb(167, 221, 200)

HSL

hsl(157, 44%, 76%)

HSB

hsb(157, 24%, 87%)

CMYK

cmyk(24%, 0%, 10%, 13%)

Oklch

oklch(85.4% 0.063 168.9)

Traditional「Jade」· Paint「Apple Green」· Creative Arctic Pool

#B1D1C0

Celadon · Silver · Apple Green

HEX

#B1D1C0

RGB

rgb(177, 209, 192)

HSL

hsl(148, 26%, 76%)

HSB

hsb(148, 15%, 82%)

CMYK

cmyk(15%, 0%, 8%, 18%)

Oklch

oklch(83.2% 0.041 162.2)

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

#B99F95

Apricot · DarkGray · Warm Sun

HEX

#B99F95

RGB

rgb(185, 159, 149)

HSL

hsl(17, 20%, 65%)

HSB

hsb(17, 19%, 73%)

CMYK

cmyk(0%, 14%, 19%, 27%)

Oklch

oklch(72.3% 0.034 42.2)

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

#EEB7B5

Peach Pink · LightPink · Cherry Blossom

HEX

#EEB7B5

RGB

rgb(238, 183, 181)

HSL

hsl(2, 63%, 82%)

HSB

hsb(2, 24%, 93%)

CMYK

cmyk(0%, 23%, 24%, 7%)

Oklch

oklch(82.9% 0.064 20.9)

Traditional「Peach Pink」· Paint「Cherry Blossom」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A3EFD8

EFA4BA

Analogous

A4EFB3

A3EFD8

A4E0EF

Triadic

A3EFD8

D8A4EF

EFD8A4

Split-Comp.

A3EFD8

EFA4E0

EFB3A4

Tetradic

A3EFD8

B3A4EF

EFA4BA

E0EFA4

Contrast Matrix WCAG 2.1 Contrast

A3EFD8	A7DDC8	B1D1C0	B99F95	EEB7B5
—	1.2 Fail	1.2 Fail	1.9 Fail	1.3 Fail
1.2 Fail	—	1.1 Fail	1.6 Fail	1.1 Fail
1.2 Fail	1.1 Fail	—	1.5 Fail	1.1 Fail
1.9 Fail	1.6 Fail	1.5 Fail	—	1.4 Fail
1.3 Fail	1.1 Fail	1.1 Fail	1.4 Fail	—

White BG

1.3Fail

1.5Fail

1.6Fail

2.5Fail

1.7Fail

Black BG

15.9AAA

13.8AAA

12.8AAA

8.5AAA

12.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

C4C5DE

BEBFCD

BFBFC4

AEAE97

D6D6B5

Deuteranopia

C0BADF

BBB7CE

BDBBC5

AFB198

D9DEB6

Tritanopia

A7E2E3

AAD1D2

B3C7C8

B8999A

EBB6B6

Achromatopsia

D6D6D6

CACACA

C5C5C5

A6A6A6

C7C7C7

Shades & Tints Shades & Tints

#A3EFD8

Dark

Light

#A7DDC8

Dark

Light

#B1D1C0

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a3efd8;
  --color-2: #a7ddc8;
  --color-3: #b1d1c0;
  --color-4: #b99f95;
  --color-5: #eeb7b5;
}

SCSS

$color-1: #a3efd8;
$color-2: #a7ddc8;
$color-3: #b1d1c0;
$color-4: #b99f95;
$color-5: #eeb7b5;

TAILWIND

colors: {
  'brand-1': '#a3efd8',
  'brand-2': '#a7ddc8',
  'brand-3': '#b1d1c0',
  'brand-4': '#b99f95',
  'brand-5': '#eeb7b5',
}

RGB Array

[163, 239, 216], [167, 221, 200], [177, 209, 192], [185, 159, 149], [238, 183, 181]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A3EFD8, #A7DDC8, #B1D1C0, #B99F95, #EEB7B5 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: #a3efd8; --color-2: #a7ddc8; --color-3: #b1d1c0; --color-4: #b99f95; --color-5: #eeb7b5. 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