#AAC1BF + #CBC7D3 + #EDCDE7 + #E7EDCC + #F9FFE0 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#AAC1BF

Jade · Silver · Lake Green

HEX

#AAC1BF

RGB

rgb(170, 193, 191)

HSL

hsl(175, 16%, 71%)

HSB

hsb(175, 12%, 76%)

CMYK

cmyk(12%, 0%, 1%, 24%)

Oklch

oklch(79.3% 0.025 190.3)

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

#CBC7D3

Wisteria · LightGray · Lilac Purple

HEX

#CBC7D3

RGB

rgb(203, 199, 211)

HSL

hsl(260, 12%, 80%)

HSB

hsb(260, 6%, 83%)

CMYK

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

Oklch

oklch(83.6% 0.017 301.2)

Traditional「Wisteria」· Paint「Lilac Purple」· Creative Lavender Dream

#EDCDE7

Mauve · Lavender · Lavender

HEX

#EDCDE7

RGB

rgb(237, 205, 231)

HSL

hsl(311, 47%, 87%)

HSB

hsb(311, 14%, 93%)

CMYK

cmyk(0%, 14%, 3%, 7%)

Oklch

oklch(88.3% 0.049 332.3)

Traditional「Mauve」· Paint「Lavender」· Creative Rose Petal

#E7EDCC

Willow Green · Beige · Mint Green

HEX

#E7EDCC

RGB

rgb(231, 237, 204)

HSL

hsl(71, 48%, 86%)

HSB

hsb(71, 14%, 93%)

CMYK

cmyk(3%, 0%, 14%, 7%)

Oklch

oklch(93.3% 0.044 115.6)

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

#F9FFE0

Willow Green · LightYellow · Mint Green

HEX

#F9FFE0

RGB

rgb(249, 255, 224)

HSL

hsl(72, 100%, 94%)

HSB

hsb(72, 12%, 100%)

CMYK

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

Oklch

oklch(98.7% 0.041 116.0)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

AAC1BF

C1A9AB

Analogous

A9C1B3

AAC1BF

A9B7C1

Triadic

AAC1BF

BFA9C1

C1BFA9

Split-Comp.

AAC1BF

C1A9B7

C1B3A9

Tetradic

AAC1BF

B3A9C1

C1A9AB

B7C1A9

Contrast Matrix WCAG 2.1 Contrast

AAC1BF	CBC7D3	EDCDE7	E7EDCC	F9FFE0
—	1.1 Fail	1.3 Fail	1.6 Fail	1.8 Fail
1.1 Fail	—	1.1 Fail	1.4 Fail	1.6 Fail
1.3 Fail	1.1 Fail	—	1.2 Fail	1.4 Fail
1.6 Fail	1.4 Fail	1.2 Fail	—	1.2 Fail
1.8 Fail	1.6 Fail	1.4 Fail	1.2 Fail	—

White BG

1.9Fail

1.7Fail

1.4Fail

1.2Fail

1.0Fail

Black BG

11.1AAA

12.6AAA

14.5AAA

17.4AAA

20.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B4B4BF

C9C9D0

DFDFE1

EAEAD4

FCFCE8

Deuteranopia

B3B1C0

CACACF

E1E3DF

E9E9D6

FBFBE9

Tritanopia

ABC0C0

CBCECD

EBDCDB

E7DADC

F9EDEF

Achromatopsia

BABABA

CACACA

DADADA

E7E7E7

FAFAFA

Shades & Tints Shades & Tints

#AAC1BF

Dark

Light

#CBC7D3

Dark

Light

#EDCDE7

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #aac1bf;
  --color-2: #cbc7d3;
  --color-3: #edcde7;
  --color-4: #e7edcc;
  --color-5: #f9ffe0;
}

SCSS

$color-1: #aac1bf;
$color-2: #cbc7d3;
$color-3: #edcde7;
$color-4: #e7edcc;
$color-5: #f9ffe0;

TAILWIND

colors: {
  'brand-1': '#aac1bf',
  'brand-2': '#cbc7d3',
  'brand-3': '#edcde7',
  'brand-4': '#e7edcc',
  'brand-5': '#f9ffe0',
}

RGB Array

[170, 193, 191], [203, 199, 211], [237, 205, 231], [231, 237, 204], [249, 255, 224]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #AAC1BF, #CBC7D3, #EDCDE7, #E7EDCC, #F9FFE0 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: #aac1bf; --color-2: #cbc7d3; --color-3: #edcde7; --color-4: #e7edcc; --color-5: #f9ffe0. 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