← Back to Editor

#FFFEFF · #E4DCD1 · #9BCDCC · #5BB5B5 · #F26170

cool

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReadingData Visualization

Color Details Color Details

#FFFEFF

Mauve · White · Lavender

HEX
#FFFEFF
RGB
rgb(255, 254, 255)
HSL
hsl(300, 100%, 100%)
HSB
hsb(300, 0%, 100%)
CMYK
cmyk(0%, 0%, 0%, 0%)
Oklch
oklch(99.8% 0.002 325.6)

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

#E4DCD1

Goose Yellow · LightGray · Peach Orange

HEX
#E4DCD1
RGB
rgb(228, 220, 209)
HSL
hsl(35, 26%, 86%)
HSB
hsb(35, 8%, 89%)
CMYK
cmyk(0%, 4%, 8%, 11%)
Oklch
oklch(89.8% 0.017 76.1)

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

#9BCDCC

Jade · LightSteelBlue · Lake Green

HEX
#9BCDCC
RGB
rgb(155, 205, 204)
HSL
hsl(179, 33%, 71%)
HSB
hsb(179, 24%, 80%)
CMYK
cmyk(24%, 0%, 0%, 20%)
Oklch
oklch(81.3% 0.052 194.6)

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

#5BB5B5

Slate Blue · MediumAquaMarine · Lake Green

HEX
#5BB5B5
RGB
rgb(91, 181, 181)
HSL
hsl(180, 38%, 53%)
HSB
hsb(180, 50%, 71%)
CMYK
cmyk(50%, 0%, 0%, 29%)
Oklch
oklch(71.8% 0.086 195.4)

Traditional「Slate Blue」· Paint「Lake Green」· Creative Blush Sunrise

#F26170

Peach Pink · Salmon · Coral Red

HEX
#F26170
RGB
rgb(242, 97, 112)
HSL
hsl(354, 85%, 66%)
HSB
hsb(354, 60%, 95%)
CMYK
cmyk(0%, 60%, 54%, 5%)
Oklch
oklch(68.1% 0.178 17.0)

Traditional「Peach Pink」· Paint「Coral Red」· Creative Rose Petal

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

FFFEFF
FFFFFF

Analogous

FFFFFF
FFFEFF
FFFFFF

Triadic

FFFEFF
FFFFFF
FFFFFF

Split-Comp.

FFFEFF
FFFFFF
FFFFFF

Tetradic

FFFEFF
FFFFFF
FFFFFF
FFFFFF

Contrast Matrix WCAG 2.1 Contrast

FFFEFF
E4DCD1
9BCDCC
5BB5B5
F26170
—
1.4
Fail
1.7
Fail
2.4
Fail
3.1
AA Large
1.4
Fail
—
1.3
Fail
1.8
Fail
2.3
Fail
1.7
Fail
1.3
Fail
—
1.4
Fail
1.8
Fail
2.4
Fail
1.8
Fail
1.4
Fail
—
1.3
Fail
3.1
AA Large
2.3
Fail
1.8
Fail
1.3
Fail
—
White BG
1.0Fail
1.4Fail
1.8Fail
2.4Fail
3.1AA Large
Black BG
20.9AAA
15.5AAA
12.0AAA
8.7AAA
6.7AA

Color Blindness Simulation Color Blindness Simulation

Protanopia

FFFFFF
E1E0D4
B1B1CC
8283B5
B3B26C

Deuteranopia

FFFFFF
E1E2D4
AEAACC
7D76B5
BCC66B

Tritanopia

FFFFFF
E4D6D6
9ECCCC
60B5B5
EB6A69

Achromatopsia

FEFEFE
DDDDDD
BEBEBE
9A9A9A
8E8E8E

Shades & Tints Shades & Tints

#FFFEFF

Dark
Light

#E4DCD1

Dark
Light

#9BCDCC

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #fffeff;
  --color-2: #e4dcd1;
  --color-3: #9bcdcc;
  --color-4: #5bb5b5;
  --color-5: #f26170;
}

SCSS

$color-1: #fffeff;
$color-2: #e4dcd1;
$color-3: #9bcdcc;
$color-4: #5bb5b5;
$color-5: #f26170;

TAILWIND

colors: {
  'brand-1': '#fffeff',
  'brand-2': '#e4dcd1',
  'brand-3': '#9bcdcc',
  'brand-4': '#5bb5b5',
  'brand-5': '#f26170',
}

RGB Array

[255, 254, 255], [228, 220, 209], [155, 205, 204], [91, 181, 181], [242, 97, 112]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This cool-style palette of #FFFEFF, #E4DCD1, #9BCDCC, #5BB5B5, #F26170 is ideal for: health products, baby brands, fresh-style blogs, infographics, data visualization, accessible design. High contrast ensures clear visual hierarchy and readability. 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: #fffeff; --color-2: #e4dcd1; --color-3: #9bcdcc; --color-4: #5bb5b5; --color-5: #f26170. 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. High-contrast palettes naturally meet WCAG accessibility standards. 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