#A18587 + #9995A1 + #C4B5BF + #DEEBFF + #CCDDDE · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#A18587

Crimson · Gray · Passion Red

HEX

#A18587

RGB

rgb(161, 133, 135)

HSL

hsl(356, 13%, 58%)

HSB

hsb(356, 17%, 63%)

CMYK

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

Oklch

oklch(64.3% 0.034 13.2)

Traditional「Crimson」· Paint「Passion Red」· Creative Blush Sunrise

#9995A1

Ash · DarkGray · Silver Sand

HEX

#9995A1

RGB

rgb(153, 149, 161)

HSL

hsl(260, 6%, 61%)

HSB

hsb(260, 7%, 63%)

CMYK

cmyk(5%, 7%, 0%, 37%)

Oklch

oklch(67.7% 0.018 301.1)

Traditional「Ash」· Paint「Silver Sand」· Creative Urban Concrete

#C4B5BF

Mauve · Silver · Rose Pink

HEX

#C4B5BF

RGB

rgb(196, 181, 191)

HSL

hsl(320, 11%, 74%)

HSB

hsb(320, 8%, 77%)

CMYK

cmyk(0%, 8%, 3%, 23%)

Oklch

oklch(78.9% 0.022 337.8)

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

#DEEBFF

Azure · Lavender · Sky Blue

HEX

#DEEBFF

RGB

rgb(222, 235, 255)

HSL

hsl(216, 100%, 94%)

HSB

hsb(216, 13%, 100%)

CMYK

cmyk(13%, 8%, 0%, 0%)

Oklch

oklch(93.6% 0.031 258.9)

Traditional「Azure」· Paint「Sky Blue」· Creative Twilight Haze

#CCDDDE

Sky Blue · LightGray · Glacier Blue

HEX

#CCDDDE

RGB

rgb(204, 221, 222)

HSL

hsl(183, 21%, 84%)

HSB

hsb(183, 8%, 87%)

CMYK

cmyk(8%, 0%, 0%, 13%)

Oklch

oklch(88.5% 0.018 201.1)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

A18587

86A2A0

Analogous

A28696

A18587

A29286

Triadic

A18587

88A286

8688A2

Split-Comp.

A18587

86A292

8696A2

Tetradic

A18587

96A286

86A2A0

9286A2

Contrast Matrix WCAG 2.1 Contrast

A18587	9995A1	C4B5BF	DEEBFF	CCDDDE
—	1.2 Fail	1.7 Fail	2.8 Fail	2.4 Fail
1.2 Fail	—	1.5 Fail	2.4 Fail	2.1 Fail
1.7 Fail	1.5 Fail	—	1.6 Fail	1.4 Fail
2.8 Fail	2.4 Fail	1.6 Fail	—	1.2 Fail
2.4 Fail	2.1 Fail	1.4 Fail	1.2 Fail	—

White BG

3.4AA Large

2.9Fail

2.0Fail

1.2Fail

1.4Fail

Black BG

6.2AA

7.2AAA

10.7AAA

17.4AAA

15.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

959587

97979E

BEBDBD

E4E4FA

D3D4DE

Deuteranopia

979986

98989D

BEC0BC

E3E2F9

D2D1DE

Tritanopia

A08686

999C9B

C3BBBA

DFF6F6

CDDEDE

Achromatopsia

8E8E8E

989898

BBBBBB

E9E9E9

D8D8D8

Shades & Tints Shades & Tints

#A18587

Dark

Light

#9995A1

Dark

Light

#C4B5BF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #a18587;
  --color-2: #9995a1;
  --color-3: #c4b5bf;
  --color-4: #deebff;
  --color-5: #ccddde;
}

SCSS

$color-1: #a18587;
$color-2: #9995a1;
$color-3: #c4b5bf;
$color-4: #deebff;
$color-5: #ccddde;

TAILWIND

colors: {
  'brand-1': '#a18587',
  'brand-2': '#9995a1',
  'brand-3': '#c4b5bf',
  'brand-4': '#deebff',
  'brand-5': '#ccddde',
}

RGB Array

[161, 133, 135], [153, 149, 161], [196, 181, 191], [222, 235, 255], [204, 221, 222]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #A18587, #9995A1, #C4B5BF, #DEEBFF, #CCDDDE 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: #a18587; --color-2: #9995a1; --color-3: #c4b5bf; --color-4: #deebff; --color-5: #ccddde. 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 cool-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