#93AFB8 + #A5CBD6 + #BFDED5 + #EBE4D1 + #FFFDF2 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#93AFB8

Sky Blue · DarkGray · Lake Green

HEX

#93AFB8

RGB

rgb(147, 175, 184)

HSL

hsl(195, 21%, 65%)

HSB

hsb(195, 20%, 72%)

CMYK

cmyk(20%, 5%, 0%, 28%)

Oklch

oklch(73.6% 0.033 219.2)

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

#A5CBD6

Sky Blue · LightSteelBlue · Lake Green

HEX

#A5CBD6

RGB

rgb(165, 203, 214)

HSL

hsl(193, 37%, 74%)

HSB

hsb(193, 23%, 84%)

CMYK

cmyk(23%, 5%, 0%, 16%)

Oklch

oklch(81.8% 0.043 217.3)

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

#BFDED5

Jade · LightGray · Glacier Blue

HEX

#BFDED5

RGB

rgb(191, 222, 213)

HSL

hsl(163, 32%, 81%)

HSB

hsb(163, 14%, 87%)

CMYK

cmyk(14%, 0%, 4%, 13%)

Oklch

oklch(87.5% 0.035 176.1)

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

#EBE4D1

Goose Yellow · Beige · Lemon Cream

HEX

#EBE4D1

RGB

rgb(235, 228, 209)

HSL

hsl(44, 39%, 87%)

HSB

hsb(44, 11%, 92%)

CMYK

cmyk(0%, 3%, 11%, 8%)

Oklch

oklch(91.9% 0.026 90.1)

Traditional「Goose Yellow」· Paint「Lemon Cream」· Creative Lemon Fizz

#FFFDF2

Fresh Green · Snow · Lemon Cream

HEX

#FFFDF2

RGB

rgb(255, 253, 242)

HSL

hsl(51, 100%, 97%)

HSB

hsb(51, 5%, 100%)

CMYK

cmyk(0%, 1%, 5%, 0%)

Oklch

oklch(99.3% 0.015 98.3)

Traditional「Fresh Green」· Paint「Lemon Cream」· Creative Lemon Fizz

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

93AFB8

B89C93

Analogous

93B8AF

93AFB8

939CB8

Triadic

93AFB8

B893AF

AFB893

Split-Comp.

93AFB8

B8939C

B8AF93

Tetradic

93AFB8

AF93B8

B89C93

9CB893

Contrast Matrix WCAG 2.1 Contrast

93AFB8	A5CBD6	BFDED5	EBE4D1	FFFDF2
—	1.3 Fail	1.6 Fail	1.8 Fail	2.3 Fail
1.3 Fail	—	1.2 Fail	1.4 Fail	1.7 Fail
1.6 Fail	1.2 Fail	—	1.1 Fail	1.4 Fail
1.8 Fail	1.4 Fail	1.1 Fail	—	1.2 Fail
2.3 Fail	1.7 Fail	1.4 Fail	1.2 Fail	—

White BG

2.3Fail

1.7Fail

1.4Fail

1.3Fail

1.0Fail

Black BG

9.1AAA

12.1AAA

14.6AAA

16.6AAA

20.6AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

9F9FB6

B5B6D3

CCCDD7

E8E8D6

FEFEF5

Deuteranopia

9E9BB5

B3B0D3

CBC8D8

E8E9D7

FEFEF5

Tritanopia

94B4B4

A7D1D1

C1D9D9

EBD9DA

FFF7F7

Achromatopsia

A8A8A8

C1C1C1

D4D4D4

E4E4E4

FCFCFC

Shades & Tints Shades & Tints

#93AFB8

Dark

Light

#A5CBD6

Dark

Light

#BFDED5

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #93afb8;
  --color-2: #a5cbd6;
  --color-3: #bfded5;
  --color-4: #ebe4d1;
  --color-5: #fffdf2;
}

SCSS

$color-1: #93afb8;
$color-2: #a5cbd6;
$color-3: #bfded5;
$color-4: #ebe4d1;
$color-5: #fffdf2;

TAILWIND

colors: {
  'brand-1': '#93afb8',
  'brand-2': '#a5cbd6',
  'brand-3': '#bfded5',
  'brand-4': '#ebe4d1',
  'brand-5': '#fffdf2',
}

RGB Array

[147, 175, 184], [165, 203, 214], [191, 222, 213], [235, 228, 209], [255, 253, 242]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #93AFB8, #A5CBD6, #BFDED5, #EBE4D1, #FFFDF2 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: #93afb8; --color-2: #a5cbd6; --color-3: #bfded5; --color-4: #ebe4d1; --color-5: #fffdf2. 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 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