#97A9AD + #78D7DB + #B4C5BF + #D5BAAC + #EBAD9C · space - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#97A9AD

Sky Blue · DarkGray · Lake Green

HEX

#97A9AD

RGB

rgb(151, 169, 173)

HSL

hsl(191, 12%, 64%)

HSB

hsb(191, 13%, 68%)

CMYK

cmyk(13%, 2%, 0%, 32%)

Oklch

oklch(72.2% 0.021 212.6)

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

#78D7DB

Sky Blue · SkyBlue · Lake Green

HEX

#78D7DB

RGB

rgb(120, 215, 219)

HSL

hsl(182, 58%, 66%)

HSB

hsb(182, 45%, 86%)

CMYK

cmyk(45%, 2%, 0%, 14%)

Oklch

oklch(82.2% 0.090 199.1)

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

#B4C5BF

Jade · Silver · Apple Green

HEX

#B4C5BF

RGB

rgb(180, 197, 191)

HSL

hsl(159, 13%, 74%)

HSB

hsb(159, 9%, 77%)

CMYK

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

Oklch

oklch(80.9% 0.020 172.6)

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

#D5BAAC

Apricot · Silver · Warm Sun

HEX

#D5BAAC

RGB

rgb(213, 186, 172)

HSL

hsl(20, 33%, 75%)

HSB

hsb(20, 19%, 84%)

CMYK

cmyk(0%, 13%, 19%, 16%)

Oklch

oklch(80.8% 0.037 49.2)

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

#EBAD9C

Peach Pink · BurlyWood · Coral Red

HEX

#EBAD9C

RGB

rgb(235, 173, 156)

HSL

hsl(13, 66%, 77%)

HSB

hsb(13, 34%, 92%)

CMYK

cmyk(0%, 26%, 34%, 8%)

Oklch

oklch(80.1% 0.077 35.9)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

97A9AD

AE9C98

Analogous

98AEA7

97A9AD

989FAE

Triadic

97A9AD

AE98AA

AAAE98

Split-Comp.

97A9AD

AE989F

AEA798

Tetradic

97A9AD

A798AE

AE9C98

9FAE98

Contrast Matrix WCAG 2.1 Contrast

97A9AD	78D7DB	B4C5BF	D5BAAC	EBAD9C
—	1.5 Fail	1.4 Fail	1.3 Fail	1.3 Fail
1.5 Fail	—	1.1 Fail	1.1 Fail	1.1 Fail
1.4 Fail	1.1 Fail	—	1.0 Fail	1.1 Fail
1.3 Fail	1.1 Fail	1.0 Fail	—	1.0 Fail
1.3 Fail	1.1 Fail	1.1 Fail	1.0 Fail	—

White BG

2.4Fail

1.7Fail

1.8Fail

1.9Fail

Black BG

8.6AAA

12.5AAA

11.7AAA

11.4AAA

11.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9FAC

A1A2DA

BBBCC0

C9C9AF

D0D0A0

Deuteranopia

9E9CAC

9C95DA

BAB9C1

CBCDB0

D4D8A1

Tritanopia

98ABAB

7DD9D9

B5C2C2

D4B2B3

E8A3A4

Achromatopsia

A4A4A4

BBBBBB

BFBFBF

C0C0C0

BEBEBE

Shades & Tints Shades & Tints

#97A9AD

Dark

Light

#78D7DB

Dark

Light

#B4C5BF

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #97a9ad;
  --color-2: #78d7db;
  --color-3: #b4c5bf;
  --color-4: #d5baac;
  --color-5: #ebad9c;
}

SCSS

$color-1: #97a9ad;
$color-2: #78d7db;
$color-3: #b4c5bf;
$color-4: #d5baac;
$color-5: #ebad9c;

TAILWIND

colors: {
  'brand-1': '#97a9ad',
  'brand-2': '#78d7db',
  'brand-3': '#b4c5bf',
  'brand-4': '#d5baac',
  'brand-5': '#ebad9c',
}

RGB Array

[151, 169, 173], [120, 215, 219], [180, 197, 191], [213, 186, 172], [235, 173, 156]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This space-style palette of #97A9AD, #78D7DB, #B4C5BF, #D5BAAC, #EBAD9C 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: #97a9ad; --color-2: #78d7db; --color-3: #b4c5bf; --color-4: #d5baac; --color-5: #ebad9c. 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 space-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