T
ToolPrime

Baby Blue Color Palette

A serene baby blue palette evoking clear skies. Perfect for healthcare, baby products, and calming interfaces.

Sky Blue

HEX: #4a8abe

RGB: rgb(74, 138, 190)

HSL: hsl(207, 47%, 52%)

Gentle Blue

HEX: #6baed6

RGB: rgb(107, 174, 214)

HSL: hsl(202, 57%, 63%)

Baby Blue

HEX: #89c4f4

RGB: rgb(137, 196, 244)

HSL: hsl(207, 83%, 75%)

Cloud

HEX: #b3d9f9

RGB: rgb(179, 217, 249)

HSL: hsl(207, 85%, 84%)

Blue Whisper

HEX: #e1f0fd

RGB: rgb(225, 240, 253)

HSL: hsl(208, 88%, 94%)

CSS Variables

:root {
  --baby-blue-1: #4a8abe;
  --baby-blue-2: #6baed6;
  --baby-blue-3: #89c4f4;
  --baby-blue-4: #b3d9f9;
  --baby-blue-5: #e1f0fd;
}

Tailwind CSS Config

// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        'baby-blue': {
          '100': '#4a8abe',
          '200': '#6baed6',
          '300': '#89c4f4',
          '400': '#b3d9f9',
          '500': '#e1f0fd',
        },
      },
    },
  },
}

Use Cases

Healthcare apps
Baby products
Meditation apps
Onboarding screens

Related Palettes

Frequently Asked Questions

Why is baby blue calming?▾
Light blues trigger the release of calming chemicals in the brain. They are associated with clear skies and still water, creating a sense of tranquility and safety.
Can baby blue work for tech products?▾
Yes. Companies like Dropbox and Skype have successfully used light blues. Baby blue conveys reliability and approachability in tech interfaces.