#778188 + #C4D6D6 + #FCDCA9 + #FFA19B + #CB1C61 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#778188

Ink Gray · SlateGray · Warm Gray

HEX

#778188

RGB

rgb(119, 129, 136)

HSL

hsl(205, 7%, 50%)

HSB

hsb(205, 12%, 53%)

CMYK

cmyk(12%, 5%, 0%, 47%)

Oklch

oklch(59.7% 0.016 238.2)

Traditional「Ink Gray」· Paint「Warm Gray」· Creative Urban Concrete

#C4D6D6

Sky Blue · LightGray · Glacier Blue

HEX

#C4D6D6

RGB

rgb(196, 214, 214)

HSL

hsl(180, 18%, 80%)

HSB

hsb(180, 8%, 84%)

CMYK

cmyk(8%, 0%, 0%, 16%)

Oklch

oklch(86.3% 0.019 196.8)

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

#FCDCA9

Goose Yellow · Wheat · Peach Orange

HEX

#FCDCA9

RGB

rgb(252, 220, 169)

HSL

hsl(37, 93%, 83%)

HSB

hsb(37, 33%, 99%)

CMYK

cmyk(0%, 13%, 33%, 1%)

Oklch

oklch(90.9% 0.075 79.2)

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

#FFA19B

Peach Pink · LightSalmon · Coral Red

HEX

#FFA19B

RGB

rgb(255, 161, 155)

HSL

hsl(4, 100%, 80%)

HSB

hsb(4, 39%, 100%)

CMYK

cmyk(0%, 37%, 39%, 0%)

Oklch

oklch(80.2% 0.113 23.8)

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

#CB1C61

Dark Violet · MediumVioletRed · Camellia

HEX

#CB1C61

RGB

rgb(203, 28, 97)

HSL

hsl(336, 76%, 45%)

HSB

hsb(336, 86%, 80%)

CMYK

cmyk(0%, 86%, 52%, 20%)

Oklch

oklch(55.1% 0.207 5.2)

Traditional「Dark Violet」· Paint「Camellia」· Creative Blush Sunrise

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

778188

887E77

Analogous

778887

778188

777888

Triadic

778188

887781

818877

Split-Comp.

778188

887778

888777

Tetradic

778188

877788

887E77

788877

Contrast Matrix WCAG 2.1 Contrast

778188	C4D6D6	FCDCA9	FFA19B	CB1C61
—	2.6 Fail	3.0 AA Large	2.0 Fail	1.4 Fail
2.6 Fail	—	1.1 Fail	1.3 Fail	3.6 AA Large
3.0 AA Large	1.1 Fail	—	1.5 Fail	4.1 AA Large
2.0 Fail	1.3 Fail	1.5 Fail	—	2.8 Fail
1.4 Fail	3.6 AA Large	4.1 AA Large	2.8 Fail	—

White BG

4.0AA Large

1.5Fail

1.3Fail

1.9Fail

5.4AA

Black BG

5.3AA

13.9AAA

15.9AAA

10.8AAA

3.9AA Large

Color Blindness Simulation Color Blindness Simulation

Protanopia

7B7B86

CCCCD6

EEEEB5

D6D59C

7F7E50

Deuteranopia

7B7A86

CBC9D6

F0F2B8

DCE39D

89974C

Tritanopia

788585

C5D6D6

FABFC1

FA9E9E

C24340

Achromatopsia

7F7F7F

D1D1D1

E0E0E0

BCBCBC

585858

Shades & Tints Shades & Tints

#778188

Dark

Light

#C4D6D6

Dark

Light

#FCDCA9

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #778188;
  --color-2: #c4d6d6;
  --color-3: #fcdca9;
  --color-4: #ffa19b;
  --color-5: #cb1c61;
}

SCSS

$color-1: #778188;
$color-2: #c4d6d6;
$color-3: #fcdca9;
$color-4: #ffa19b;
$color-5: #cb1c61;

TAILWIND

colors: {
  'brand-1': '#778188',
  'brand-2': '#c4d6d6',
  'brand-3': '#fcdca9',
  'brand-4': '#ffa19b',
  'brand-5': '#cb1c61',
}

RGB Array

[119, 129, 136], [196, 214, 214], [252, 220, 169], [255, 161, 155], [203, 28, 97]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #778188, #C4D6D6, #FCDCA9, #FFA19B, #CB1C61 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: #778188; --color-2: #c4d6d6; --color-3: #fcdca9; --color-4: #ffa19b; --color-5: #cb1c61. 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