← Back to Editor

#778388 · #CCEAEE · #B9D7D8 · #A8D3D4 · #91BDBE

A 5-color palette palette · Complete color analysis and application guide

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#778388

Ink Gray · SlateGray · Warm Gray

HEX
#778388
RGB
rgb(119, 131, 136)
HSL
hsl(198, 7%, 50%)
HSB
hsb(198, 12%, 53%)
CMYK
cmyk(12%, 4%, 0%, 47%)
Oklch
oklch(60.2% 0.016 224.6)

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

#CCEAEE

Sky Blue · Lavender · Glacier Blue

HEX
#CCEAEE
RGB
rgb(204, 234, 238)
HSL
hsl(187, 50%, 87%)
HSB
hsb(187, 14%, 93%)
CMYK
cmyk(14%, 2%, 0%, 7%)
Oklch
oklch(91.7% 0.032 206.4)

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

#B9D7D8

Sky Blue · LightBlue · Glacier Blue

HEX
#B9D7D8
RGB
rgb(185, 215, 216)
HSL
hsl(182, 28%, 79%)
HSB
hsb(182, 14%, 85%)
CMYK
cmyk(14%, 0%, 0%, 15%)
Oklch
oklch(85.8% 0.032 199.0)

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

#A8D3D4

Sky Blue · LightBlue · Lake Green

HEX
#A8D3D4
RGB
rgb(168, 211, 212)
HSL
hsl(181, 34%, 75%)
HSB
hsb(181, 21%, 83%)
CMYK
cmyk(21%, 0%, 0%, 17%)
Oklch
oklch(83.7% 0.045 198.1)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

#91BDBE

Sky Blue · DarkGray · Lake Green

HEX
#91BDBE
RGB
rgb(145, 189, 190)
HSL
hsl(181, 26%, 66%)
HSB
hsb(181, 24%, 75%)
CMYK
cmyk(24%, 1%, 0%, 25%)
Oklch
oklch(76.7% 0.047 198.0)

Traditional「Sky Blue」· Paint「Lake Green」· Creative Arctic Pool

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

778388
887C77

Analogous

778885
778388
777A88

Triadic

778388
887783
838877

Split-Comp.

778388
88777A
888577

Tetradic

778388
857788
887C77
7A8877

Contrast Matrix WCAG 2.1 Contrast

778388
CCEAEE
B9D7D8
A8D3D4
91BDBE
—
3.1
AA Large
2.6
Fail
2.4
Fail
1.9
Fail
3.1
AA Large
—
1.2
Fail
1.3
Fail
1.6
Fail
2.6
Fail
1.2
Fail
—
1.1
Fail
1.3
Fail
2.4
Fail
1.3
Fail
1.1
Fail
—
1.3
Fail
1.9
Fail
1.6
Fail
1.3
Fail
1.3
Fail
—
White BG
3.9AA Large
1.3Fail
1.5Fail
1.6Fail
2.1Fail
Black BG
5.4AA
16.6AAA
13.8AAA
12.9AAA
10.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

7C7C87
D9D9ED
C6C6D8
BBBBD4
A4A4BE

Deuteranopia

7C7B87
D7D5ED
C4C2D8
B8B5D4
A29EBE

Tritanopia

788686
CDECEC
BBD8D8
AAD4D4
93BEBE

Achromatopsia

808080
E1E1E1
CECECE
C6C6C6
B0B0B0

Shades & Tints Shades & Tints

#778388

Dark
Light

#CCEAEE

Dark
Light

#B9D7D8

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #778388;
  --color-2: #cceaee;
  --color-3: #b9d7d8;
  --color-4: #a8d3d4;
  --color-5: #91bdbe;
}

SCSS

$color-1: #778388;
$color-2: #cceaee;
$color-3: #b9d7d8;
$color-4: #a8d3d4;
$color-5: #91bdbe;

TAILWIND

colors: {
  'brand-1': '#778388',
  'brand-2': '#cceaee',
  'brand-3': '#b9d7d8',
  'brand-4': '#a8d3d4',
  'brand-5': '#91bdbe',
}

RGB Array

[119, 131, 136], [204, 234, 238], [185, 215, 216], [168, 211, 212], [145, 189, 190]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #778388, #CCEAEE, #B9D7D8, #A8D3D4, #91BDBE is ideal for: brand design, premium product pages, magazine layouts, health products, baby brands, fresh-style blogs. Low-saturation colors convey a sophisticated, premium feel. It is a classic and elegant choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #778388; --color-2: #cceaee; --color-3: #b9d7d8; --color-4: #a8d3d4; --color-5: #91bdbe. 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 beauty, lifestyle, arts industries. Restrained colors convey professionalism and trust. 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