#55A898 + #A8C9CE + #AAB486 + #E1A188 + #E5BF93 · cool - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#55A898

Mineral Blue · CadetBlue · Mint Ice

HEX

#55A898

RGB

rgb(85, 168, 152)

HSL

hsl(168, 33%, 50%)

HSB

hsb(168, 49%, 66%)

CMYK

cmyk(49%, 0%, 10%, 34%)

Oklch

oklch(67.5% 0.085 179.4)

Traditional「Mineral Blue」· Paint「Mint Ice」· Creative Blush Sunrise

#A8C9CE

Sky Blue · LightSteelBlue · Lake Green

HEX

#A8C9CE

RGB

rgb(168, 201, 206)

HSL

hsl(188, 28%, 73%)

HSB

hsb(188, 18%, 81%)

CMYK

cmyk(18%, 2%, 0%, 19%)

Oklch

oklch(81.3% 0.036 207.7)

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

#AAB486

Willow Green · DarkSeaGreen · Apple Green

HEX

#AAB486

RGB

rgb(170, 180, 134)

HSL

hsl(73, 23%, 62%)

HSB

hsb(73, 26%, 71%)

CMYK

cmyk(6%, 0%, 26%, 29%)

Oklch

oklch(75.0% 0.064 117.9)

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

#E1A188

Apricot · DarkSalmon · Warm Sun

HEX

#E1A188

RGB

rgb(225, 161, 136)

HSL

hsl(17, 60%, 71%)

HSB

hsb(17, 40%, 88%)

CMYK

cmyk(0%, 28%, 40%, 12%)

Oklch

oklch(76.4% 0.084 42.2)

Traditional「Apricot」· Paint「Warm Sun」· Creative Honey Glow

#E5BF93

Goose Yellow · BurlyWood · Warm Sun

HEX

#E5BF93

RGB

rgb(229, 191, 147)

HSL

hsl(32, 61%, 74%)

HSB

hsb(32, 36%, 90%)

CMYK

cmyk(0%, 17%, 36%, 10%)

Oklch

oklch(82.7% 0.073 70.7)

Traditional「Goose Yellow」· Paint「Warm Sun」· Creative Honey Glow

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

55A898

AA5566

Analogous

55AA6F

55A898

5590AA

Triadic

55A898

9955AA

AA9955

Split-Comp.

55A898

AA5590

AA6F55

Tetradic

55A898

6F55AA

AA5566

90AA55

Contrast Matrix WCAG 2.1 Contrast

55A898	A8C9CE	AAB486	E1A188	E5BF93
—	1.6 Fail	1.3 Fail	1.3 Fail	1.6 Fail
1.6 Fail	—	1.2 Fail	1.2 Fail	1.0 Fail
1.3 Fail	1.2 Fail	—	1.0 Fail	1.3 Fail
1.3 Fail	1.2 Fail	1.0 Fail	—	1.3 Fail
1.6 Fail	1.0 Fail	1.3 Fail	1.3 Fail	—

White BG

2.8Fail

1.8Fail

2.2Fail

1.7Fail

Black BG

7.4AAA

11.9AAA

9.6AAA

9.7AAA

12.2AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

797A9C

B6B7CD

AEAE91

C5C58E

D5D49E

Deuteranopia

746E9D

B4B2CD

AEAD94

C9CE90

D7DAA0

Tritanopia

599FA0

AACCCC

AB9A9C

DE9394

E3A6A8

Achromatopsia

8D8D8D

C0C0C0

ACACAC

B1B1B1

C5C5C5

Shades & Tints Shades & Tints

#55A898

Dark

Light

#A8C9CE

Dark

Light

#AAB486

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #55a898;
  --color-2: #a8c9ce;
  --color-3: #aab486;
  --color-4: #e1a188;
  --color-5: #e5bf93;
}

SCSS

$color-1: #55a898;
$color-2: #a8c9ce;
$color-3: #aab486;
$color-4: #e1a188;
$color-5: #e5bf93;

TAILWIND

colors: {
  'brand-1': '#55a898',
  'brand-2': '#a8c9ce',
  'brand-3': '#aab486',
  'brand-4': '#e1a188',
  'brand-5': '#e5bf93',
}

RGB Array

[85, 168, 152], [168, 201, 206], [170, 180, 134], [225, 161, 136], [229, 191, 147]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #55A898, #A8C9CE, #AAB486, #E1A188, #E5BF93 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: #55a898; --color-2: #a8c9ce; --color-3: #aab486; --color-4: #e1a188; --color-5: #e5bf93. 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