← Back to Editor

#C5D9E3 · #8BB2C7 · #7CA8C0 · #FFF48C · #FFFACC

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

Scene Recommendations Scene Recommendations

Emotion EMOTION

PassionateDynamicWarmCool

Industry INDUSTRY

EntertainmentFMCG

UI Context UI CONTEXT

Sale PromoSocial App

Color Details Color Details

#C5D9E3

Sky Blue · LightGray · Sky Blue

HEX
#C5D9E3
RGB
rgb(197, 217, 227)
HSL
hsl(200, 35%, 83%)
HSB
hsb(200, 13%, 89%)
CMYK
cmyk(13%, 4%, 0%, 11%)
Oklch
oklch(87.3% 0.026 229.2)

Traditional「Sky Blue」· Paint「Sky Blue」· Creative Twilight Haze

#8BB2C7

Sky Blue · DarkGray · Cobalt Blue

HEX
#8BB2C7
RGB
rgb(139, 178, 199)
HSL
hsl(201, 35%, 66%)
HSB
hsb(201, 30%, 78%)
CMYK
cmyk(30%, 11%, 0%, 22%)
Oklch
oklch(74.2% 0.052 231.9)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#7CA8C0

Sky Blue · CadetBlue · Cobalt Blue

HEX
#7CA8C0
RGB
rgb(124, 168, 192)
HSL
hsl(201, 35%, 62%)
HSB
hsb(201, 35%, 75%)
CMYK
cmyk(35%, 13%, 0%, 25%)
Oklch
oklch(70.8% 0.059 232.5)

Traditional「Sky Blue」· Paint「Cobalt Blue」· Creative Twilight Haze

#FFF48C

Fresh Green · Khaki · Lemon Cream

HEX
#FFF48C
RGB
rgb(255, 244, 140)
HSL
hsl(54, 100%, 77%)
HSB
hsb(54, 45%, 100%)
CMYK
cmyk(0%, 4%, 45%, 0%)
Oklch
oklch(95.4% 0.126 103.2)

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

#FFFACC

Fresh Green · Beige · Lemon Cream

HEX
#FFFACC
RGB
rgb(255, 250, 204)
HSL
hsl(54, 100%, 90%)
HSB
hsb(54, 20%, 100%)
CMYK
cmyk(0%, 2%, 20%, 0%)
Oklch
oklch(97.8% 0.059 102.3)

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

Color Harmonies Color Harmonies

Based on color wheel theory, calculated from primary color

Complementary

C5D9E3
E3CFC4

Analogous

C4E3DE
C5D9E3
C4CAE3

Triadic

C5D9E3
E3C4D9
D9E3C4

Split-Comp.

C5D9E3
E3C4CA
E3DEC4

Tetradic

C5D9E3
DEC4E3
E3CFC4
CAE3C4

Contrast Matrix WCAG 2.1 Contrast

C5D9E3
8BB2C7
7CA8C0
FFF48C
FFFACC
—
1.6
Fail
1.8
Fail
1.3
Fail
1.4
Fail
1.6
Fail
—
1.1
Fail
2.0
Fail
2.1
Fail
1.8
Fail
1.1
Fail
—
2.3
Fail
2.4
Fail
1.3
Fail
2.0
Fail
2.3
Fail
—
1.1
Fail
1.4
Fail
2.1
Fail
2.4
Fail
1.1
Fail
—
White BG
1.5Fail
2.3Fail
2.6Fail
1.1Fail
1.1Fail
Black BG
14.4AAA
9.3AAA
8.2AAA
18.6AAA
19.8AAA

Color Blindness Simulation Color Blindness Simulation

Protanopia

CECEE1
9C9CC2
8F8FBA
FAFAA5
FDFDD7

Deuteranopia

CDCBE0
9A97C1
8D89B9
FBFCAB
FDFEDA

Tritanopia

C6DFDE
8DBEBD
7EB6B5
FEB9BD
FFE0E2

Achromatopsia

D4D4D4
A9A9A9
9E9E9E
EBEBEB
F6F6F6

Shades & Tints Shades & Tints

#C5D9E3

Dark
Light

#8BB2C7

Dark
Light

#7CA8C0

Dark
Light

Code Snippets Code Snippets

CSS Custom Properties

:root {
  --color-1: #c5d9e3;
  --color-2: #8bb2c7;
  --color-3: #7ca8c0;
  --color-4: #fff48c;
  --color-5: #fffacc;
}

SCSS

$color-1: #c5d9e3;
$color-2: #8bb2c7;
$color-3: #7ca8c0;
$color-4: #fff48c;
$color-5: #fffacc;

TAILWIND

colors: {
  'brand-1': '#c5d9e3',
  'brand-2': '#8bb2c7',
  'brand-3': '#7ca8c0',
  'brand-4': '#fff48c',
  'brand-5': '#fffacc',
}

RGB Array

[197, 217, 227], [139, 178, 199], [124, 168, 192], [255, 244, 140], [255, 250, 204]

FAQ FAQ

What scenarios is this 5-color palette suitable for?

This general-style palette of #C5D9E3, #8BB2C7, #7CA8C0, #FFF48C, #FFFACC is ideal for: social media posters, mobile apps, e-commerce promos, health products, baby brands, fresh-style blogs. Vivid colors effectively attract user attention. It is a vibrant and energetic choice among 5-color palettes.

How to use this palette in CSS or frontend projects?

Copy the CSS variables directly: --color-1: #c5d9e3; --color-2: #8bb2c7; --color-3: #7ca8c0; --color-4: #fff48c; --color-5: #fffacc. 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 food & dining, entertainment, kids education, social industries. Bold colors convey vitality and innovation. 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