#CAE6E6 + #F7C385 + #95BDBD + #F5F6D0 + #A8D4D3 - Color Palette

Scene Recommendations Scene Recommendations

Emotion EMOTION

AiryCleanWarmCool

Industry INDUSTRY

HealthcareSaaS

UI Context UI CONTEXT

WorkspaceReading

Color Details Color Details

#CAE6E6

Sky Blue · LightGray · Glacier Blue

HEX

#CAE6E6

RGB

rgb(202, 230, 230)

HSL

hsl(180, 36%, 85%)

HSB

hsb(180, 12%, 90%)

CMYK

cmyk(12%, 0%, 0%, 10%)

Oklch

oklch(90.5% 0.030 196.6)

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

#F7C385

Goose Yellow · BurlyWood · Warm Sun

HEX

#F7C385

RGB

rgb(247, 195, 133)

HSL

hsl(33, 88%, 75%)

HSB

hsb(33, 46%, 97%)

CMYK

cmyk(0%, 21%, 46%, 3%)

Oklch

oklch(85.0% 0.099 70.8)

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

#95BDBD

Sky Blue · DarkGray · Lake Green

HEX

#95BDBD

RGB

rgb(149, 189, 189)

HSL

hsl(180, 23%, 66%)

HSB

hsb(180, 21%, 74%)

CMYK

cmyk(21%, 0%, 0%, 26%)

Oklch

oklch(76.9% 0.043 196.3)

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

#F5F6D0

Fresh Green · Beige · Lemon Cream

HEX

#F5F6D0

RGB

rgb(245, 246, 208)

HSL

hsl(62, 68%, 89%)

HSB

hsb(62, 15%, 96%)

CMYK

cmyk(0%, 0%, 15%, 4%)

Oklch

oklch(96.3% 0.049 108.5)

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

#A8D4D3

Jade · LightBlue · Lake Green

HEX

#A8D4D3

RGB

rgb(168, 212, 211)

HSL

hsl(179, 34%, 75%)

HSB

hsb(179, 21%, 83%)

CMYK

cmyk(21%, 0%, 0%, 17%)

Oklch

oklch(83.9% 0.046 194.6)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

CAE6E6

E7CBCB

Analogous

CBE7D9

CAE6E6

CBD9E7

Triadic

CAE6E6

E7CBE7

E7E7CB

Split-Comp.

CAE6E6

E7CBD9

E7D9CB

Tetradic

CAE6E6

D9CBE7

E7CBCB

D9E7CB

Contrast Matrix WCAG 2.1 Contrast

CAE6E6	F7C385	95BDBD	F5F6D0	A8D4D3
—	1.2 Fail	1.6 Fail	1.2 Fail	1.2 Fail
1.2 Fail	—	1.3 Fail	1.4 Fail	1.0 Fail
1.6 Fail	1.3 Fail	—	1.8 Fail	1.3 Fail
1.2 Fail	1.4 Fail	1.8 Fail	—	1.5 Fail
1.2 Fail	1.0 Fail	1.3 Fail	1.5 Fail	—

White BG

1.3Fail

1.6Fail

2.0Fail

1.1Fail

1.6Fail

Black BG

16.0AAA

13.1AAA

10.3AAA

19.0AAA

13.0AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

D6D6E6

E0E094

A6A7BD

F5F5D9

BBBBD3

Deuteranopia

D5D2E6

E4E798

A4A1BD

F5F5DB

B9B5D3

Tritanopia

CBE6E6

F4A0A2

97BDBD

F5E0E2

AAD3D3

Achromatopsia

DEDEDE

CBCBCB

B1B1B1

F1F1F1

C7C7C7

Shades & Tints Shades & Tints

#CAE6E6

Dark

Light

#F7C385

Dark

Light

#95BDBD

Dark

Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #cae6e6;
  --color-2: #f7c385;
  --color-3: #95bdbd;
  --color-4: #f5f6d0;
  --color-5: #a8d4d3;
}

SCSS

$color-1: #cae6e6;
$color-2: #f7c385;
$color-3: #95bdbd;
$color-4: #f5f6d0;
$color-5: #a8d4d3;

TAILWIND

colors: {
  'brand-1': '#cae6e6',
  'brand-2': '#f7c385',
  'brand-3': '#95bdbd',
  'brand-4': '#f5f6d0',
  'brand-5': '#a8d4d3',
}

RGB Array

[202, 230, 230], [247, 195, 133], [149, 189, 189], [245, 246, 208], [168, 212, 211]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #CAE6E6, #F7C385, #95BDBD, #F5F6D0, #A8D4D3 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: #cae6e6; --color-2: #f7c385; --color-3: #95bdbd; --color-4: #f5f6d0; --color-5: #a8d4d3. 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