#A7D9CA + #D0D6B2 + #DEC2A6 + #F5A295 + #FC7C8B - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A7D9CA

Jade · LightBlue · Lake Green

HEX

#A7D9CA

RGB

rgb(167, 217, 202)

HSL

hsl(162, 40%, 75%)

HSB

hsb(162, 23%, 85%)

CMYK

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

Oklch

oklch(84.6% 0.056 174.6)

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

#D0D6B2

Willow Green · Silver · Apple Green

HEX

#D0D6B2

RGB

rgb(208, 214, 178)

HSL

hsl(70, 31%, 77%)

HSB

hsb(70, 17%, 84%)

CMYK

cmyk(3%, 0%, 17%, 16%)

Oklch

oklch(86.2% 0.049 115.1)

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

#DEC2A6

Goose Yellow · Tan · Peach Orange

HEX

#DEC2A6

RGB

rgb(222, 194, 166)

HSL

hsl(30, 46%, 76%)

HSB

hsb(30, 25%, 87%)

CMYK

cmyk(0%, 13%, 25%, 13%)

Oklch

oklch(83.1% 0.049 67.1)

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

#F5A295

Peach Pink · LightSalmon · Coral Red

HEX

#F5A295

RGB

rgb(245, 162, 149)

HSL

hsl(8, 83%, 77%)

HSB

hsb(8, 39%, 96%)

CMYK

cmyk(0%, 34%, 39%, 4%)

Oklch

oklch(79.1% 0.101 29.3)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Blush Sunrise

#FC7C8B

Peach Pink · LightCoral · Coral Red

HEX

#FC7C8B

RGB

rgb(252, 124, 139)

HSL

hsl(353, 96%, 74%)

HSB

hsb(353, 51%, 99%)

CMYK

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

Oklch

oklch(73.7% 0.156 14.4)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A7D9CA

D9A6B5

Analogous

A6D9B0

A7D9CA

A6CFD9

Triadic

A7D9CA

C9A6D9

D9C9A6

Split-Comp.

A7D9CA

D9A6CF

D9B0A6

Tetradic

A7D9CA

B0A6D9

D9A6B5

CFD9A6

Contrast Matrix WCAG 2.1 Contrast

A7D9CA	D0D6B2	DEC2A6	F5A295	FC7C8B
—	1.0 Fail	1.1 Fail	1.3 Fail	1.6 Fail
1.0 Fail	—	1.1 Fail	1.3 Fail	1.7 Fail
1.1 Fail	1.1 Fail	—	1.2 Fail	1.5 Fail
1.3 Fail	1.3 Fail	1.2 Fail	—	1.2 Fail
1.6 Fail	1.7 Fail	1.5 Fail	1.2 Fail	—

White BG

1.6Fail

1.5Fail

1.7Fail

2.0Fail

2.5Fail

Black BG

13.4AAA

13.9AAA

12.4AAA

10.5AAA

8.4AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

BDBDCE

D3D3BB

D2D2AD

D1D098

C5C387

Deuteranopia

BAB6CE

D2D2BD

D4D6AE

D6DC99

CCD687

Tritanopia

AAD0D1

D0C2C3

DDB2B3

F19B9B

F68584

Achromatopsia

C8C8C8

D0D0D0

C7C7C7

B9B9B9

A4A4A4

Shades & Tints Shades & Tints

#A7D9CA

Dark

Light

#D0D6B2

Dark

Light

#DEC2A6

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a7d9ca;
  --color-2: #d0d6b2;
  --color-3: #dec2a6;
  --color-4: #f5a295;
  --color-5: #fc7c8b;
}

SCSS

$color-1: #a7d9ca;
$color-2: #d0d6b2;
$color-3: #dec2a6;
$color-4: #f5a295;
$color-5: #fc7c8b;

TAILWIND

colors: {
  'brand-1': '#a7d9ca',
  'brand-2': '#d0d6b2',
  'brand-3': '#dec2a6',
  'brand-4': '#f5a295',
  'brand-5': '#fc7c8b',
}

RGB Array

[167, 217, 202], [208, 214, 178], [222, 194, 166], [245, 162, 149], [252, 124, 139]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A7D9CA, #D0D6B2, #DEC2A6, #F5A295, #FC7C8B 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: #a7d9ca; --color-2: #d0d6b2; --color-3: #dec2a6; --color-4: #f5a295; --color-5: #fc7c8b. 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