#A5C9CC + #F2E8D8 + #E2E6DA + #D3EBE1 + #B7EBE7 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A5C9CC

Sky Blue · LightSteelBlue · Lake Green

HEX

#A5C9CC

RGB

rgb(165, 201, 204)

HSL

hsl(185, 28%, 72%)

HSB

hsb(185, 19%, 80%)

CMYK

cmyk(19%, 1%, 0%, 20%)

Oklch

oklch(81.1% 0.039 202.7)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#F2E8D8

Goose Yellow · Beige · Peach Orange

HEX

#F2E8D8

RGB

rgb(242, 232, 216)

HSL

hsl(37, 50%, 90%)

HSB

hsb(37, 11%, 95%)

CMYK

cmyk(0%, 4%, 11%, 5%)

Oklch

oklch(93.5% 0.024 79.7)

Traditional「Goose Yellow」· Paint「Peach Orange」· Creative Honey Glow

#E2E6DA

Willow Green · Beige · Mint Green

HEX

#E2E6DA

RGB

rgb(226, 230, 218)

HSL

hsl(80, 19%, 88%)

HSB

hsb(80, 5%, 90%)

CMYK

cmyk(2%, 0%, 5%, 10%)

Oklch

oklch(91.9% 0.017 121.8)

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

#D3EBE1

Jade · LightGray · Mint Green

HEX

#D3EBE1

RGB

rgb(211, 235, 225)

HSL

hsl(155, 37%, 87%)

HSB

hsb(155, 10%, 92%)

CMYK

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

Oklch

oklch(92.0% 0.029 168.8)

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

#B7EBE7

Jade · LightBlue · Glacier Blue

HEX

#B7EBE7

RGB

rgb(183, 235, 231)

HSL

hsl(175, 57%, 82%)

HSB

hsb(175, 22%, 92%)

CMYK

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

Oklch

oklch(90.3% 0.053 190.4)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A5C9CC

CCA7A4

Analogous

A4CCBB

A5C9CC

A4B4CC

Triadic

A5C9CC

CCA4C8

C8CCA4

Split-Comp.

A5C9CC

CCA4B4

CCBBA4

Tetradic

A5C9CC

BBA4CC

CCA7A4

B4CCA4

Contrast Matrix WCAG 2.1 Contrast

A5C9CC	F2E8D8	E2E6DA	D3EBE1	B7EBE7
—	1.5 Fail	1.4 Fail	1.4 Fail	1.4 Fail
1.5 Fail	—	1.0 Fail	1.0 Fail	1.1 Fail
1.4 Fail	1.0 Fail	—	1.0 Fail	1.0 Fail
1.4 Fail	1.0 Fail	1.0 Fail	—	1.0 Fail
1.4 Fail	1.1 Fail	1.0 Fail	1.0 Fail	—

White BG

1.8Fail

1.2Fail

1.3Fail

Black BG

11.8AAA

17.3AAA

16.6AAA

16.7AAA

16.1AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B5B5CB

EEEEDC

E4E4DD

DDDEE3

CECEE8

Deuteranopia

B3B0CB

EEEFDD

E4E3DE

DCDAE4

CBC7E8

Tritanopia

A7CBCB

F1DFE0

E2DFE0

D4E5E6

BAE9E9

Achromatopsia

BFBFBF

E9E9E9

E3E3E3

DBDBDB

Shades & Tints Shades & Tints

#A5C9CC

Dark

Light

#F2E8D8

Dark

Light

#E2E6DA

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a5c9cc;
  --color-2: #f2e8d8;
  --color-3: #e2e6da;
  --color-4: #d3ebe1;
  --color-5: #b7ebe7;
}

SCSS

$color-1: #a5c9cc;
$color-2: #f2e8d8;
$color-3: #e2e6da;
$color-4: #d3ebe1;
$color-5: #b7ebe7;

TAILWIND

colors: {
  'brand-1': '#a5c9cc',
  'brand-2': '#f2e8d8',
  'brand-3': '#e2e6da',
  'brand-4': '#d3ebe1',
  'brand-5': '#b7ebe7',
}

RGB Array

[165, 201, 204], [242, 232, 216], [226, 230, 218], [211, 235, 225], [183, 235, 231]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A5C9CC, #F2E8D8, #E2E6DA, #D3EBE1, #B7EBE7 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: #a5c9cc; --color-2: #f2e8d8; --color-3: #e2e6da; --color-4: #d3ebe1; --color-5: #b7ebe7. 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