#A8C9C7 + #E9D8BF + #FAC9AE + #F0A893 + #A7887C - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A8C9C7

Jade · LightSteelBlue · Lake Green

HEX

#A8C9C7

RGB

rgb(168, 201, 199)

HSL

hsl(176, 23%, 72%)

HSB

hsb(176, 16%, 79%)

CMYK

cmyk(16%, 0%, 1%, 21%)

Oklch

oklch(81.1% 0.035 192.0)

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

#E9D8BF

Goose Yellow · Wheat · Peach Orange

HEX

#E9D8BF

RGB

rgb(233, 216, 191)

HSL

hsl(36, 49%, 83%)

HSB

hsb(36, 18%, 91%)

CMYK

cmyk(0%, 7%, 18%, 9%)

Oklch

oklch(88.9% 0.038 77.6)

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

#FAC9AE

Apricot · Wheat · Peach Orange

HEX

#FAC9AE

RGB

rgb(250, 201, 174)

HSL

hsl(21, 88%, 83%)

HSB

hsb(21, 30%, 98%)

CMYK

cmyk(0%, 20%, 30%, 2%)

Oklch

oklch(87.2% 0.067 50.3)

Traditional「Apricot」· Paint「Peach Orange」· Creative Honey Glow

#F0A893

Peach Pink · BurlyWood · Coral Red

HEX

#F0A893

RGB

rgb(240, 168, 147)

HSL

hsl(14, 76%, 76%)

HSB

hsb(14, 39%, 94%)

CMYK

cmyk(0%, 30%, 39%, 6%)

Oklch

oklch(79.5% 0.091 36.9)

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

#A7887C

Tangerine · Gray · Warm Sun

HEX

#A7887C

RGB

rgb(167, 136, 124)

HSL

hsl(17, 20%, 57%)

HSB

hsb(17, 26%, 65%)

CMYK

cmyk(0%, 19%, 26%, 35%)

Oklch

oklch(65.2% 0.042 42.2)

Traditional「Tangerine」· Paint「Warm Sun」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A8C9C7

C8A7A9

Analogous

A7C8B5

A8C9C7

A7BAC8

Triadic

A8C9C7

C6A7C8

C8C6A7

Split-Comp.

A8C9C7

C8A7BA

C8B5A7

Tetradic

A8C9C7

B5A7C8

C8A7A9

BAC8A7

Contrast Matrix WCAG 2.1 Contrast

A8C9C7	E9D8BF	FAC9AE	F0A893	A7887C
—	1.3 Fail	1.2 Fail	1.1 Fail	1.8 Fail
1.3 Fail	—	1.1 Fail	1.4 Fail	2.3 Fail
1.2 Fail	1.1 Fail	—	1.3 Fail	2.2 Fail
1.1 Fail	1.4 Fail	1.3 Fail	—	1.7 Fail
1.8 Fail	2.3 Fail	2.2 Fail	1.7 Fail	—

White BG

1.8Fail

1.4Fail

1.5Fail

2.0Fail

3.3AA Large

Black BG

11.8AAA

15.0AAA

14.0AAA

10.7AAA

6.5AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

B6B7C7

E2E1C5

E5E4B5

D1D098

9A997F

Deuteranopia

B4B2C8

E3E4C7

E8EBB6

D5DA99

9B9E80

Tritanopia

AAC8C8

E8CACB

F8BABB

EC9C9D

A58182

Achromatopsia

BFBFBF

DADADA

D5D5D5

BBBBBB

909090

Shades & Tints Shades & Tints

#A8C9C7

Dark

Light

#E9D8BF

Dark

Light

#FAC9AE

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a8c9c7;
  --color-2: #e9d8bf;
  --color-3: #fac9ae;
  --color-4: #f0a893;
  --color-5: #a7887c;
}

SCSS

$color-1: #a8c9c7;
$color-2: #e9d8bf;
$color-3: #fac9ae;
$color-4: #f0a893;
$color-5: #a7887c;

TAILWIND

colors: {
  'brand-1': '#a8c9c7',
  'brand-2': '#e9d8bf',
  'brand-3': '#fac9ae',
  'brand-4': '#f0a893',
  'brand-5': '#a7887c',
}

RGB Array

[168, 201, 199], [233, 216, 191], [250, 201, 174], [240, 168, 147], [167, 136, 124]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #A8C9C7, #E9D8BF, #FAC9AE, #F0A893, #A7887C 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: #a8c9c7; --color-2: #e9d8bf; --color-3: #fac9ae; --color-4: #f0a893; --color-5: #a7887c. 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