#FAFAF8Snow
#D9D9D4Fog
#00D2ECSky Blue
#1E1E1CRaisin

Bright Sky Blue & Fog color palette

Open in generator
Ask AI about this palette: ChatGPTClaudePerplexity

Bright Sky Blue & Fog is a neutral-based color palette tagged modern, minimal, white. Sky Blue is the only saturated color here, so it does all the talking against a neutral base. Neither washed out nor loud, it adapts to most contexts. Warm and cool hues are mixed, which adds depth.

Color codes click any value to copy

SwatchNameHEXRGBHSLOKLCH
Snow#FAFAF8rgb(250, 250, 248)hsl(60, 17%, 98%)oklch(98.5% 0.003 106)
Fog#D9D9D4rgb(217, 217, 212)hsl(60, 6%, 84%)oklch(88.4% 0.007 107)
Sky Blue#00D2ECrgb(0, 210, 236)hsl(187, 100%, 46%)oklch(79.2% 0.137 210)
Raisin#1E1E1Crgb(30, 30, 28)hsl(60, 3%, 11%)oklch(23.4% 0.004 107)

Why it works and how to use it

The palette holds together thanks to its neutral backbone and a strong light-to-dark ladder (98% down to 11% lightness). A natural fit for websites, presentations and branding.

  • Background: Snow (#FAFAF8) is the lightest color, so it belongs on large surfaces.
  • Text: Raisin (#1E1E1C) on #FAFAF8 gives 15.98:1, passing WCAG AAA.
  • Primary: Sky Blue (#00D2EC) is the most saturated mid-tone; use it for buttons and links with a border or a darker shade for contrast.
  • Accent: Fog (#D9D9D4) for highlights, badges and hover states.

3 of 6 color pairs pass WCAG AA (4.5:1); the strongest is Snow on Raisin at 15.98:1.

Preview on a real UI see how the palette feels in context

BrandFeaturesPricingBlogGet started

Design faster with Bright Sky Blue & Fog

A palette preview that turns four colors into a page, so you can judge hierarchy, contrast and mood before you commit.

Primary action Secondary
Card title
Card title
Card title
Roles are assigned by lightness.

Color blindness simulation

#FAFAF8
#D9D9D4
#00D2EC
#1E1E1C

Color-blind check: under protanopia, Fog and Sky Blue become hard to tell apart, so do not rely on that pair alone to carry meaning.

Contrast check WCAG ratios between palette colors

PairSampleRatioLevel
#FAFAF8 on #1E1E1CAa15.98:1AAA
#D9D9D4 on #1E1E1CAa11.79:1AAA
#00D2EC on #1E1E1CAa9.09:1AAA
#FAFAF8 on #00D2ECAa1.76:1Fail
#FAFAF8 on #D9D9D4Aa1.36:1Fail
#D9D9D4 on #00D2ECAa1.3:1Fail

Similar palettes 24 more in this mood