301 palettes tagged #blue
Cool, calming blue color palettes — from sky and ocean tones to deep navy.
The blue reference values and ready-to-paste CSS variables. Click any value to copy it.
:root {
--blue-50: #E3F2FD;
--blue-200: #64B5F6;
--blue-400: #1565C0;
--blue-600: #0D47A1;
--blue-800: #1A237E;
}
Prefer Tailwind? Drop these hex codes into the colors key of your tailwind.config.js, or copy any palette above as a full Tailwind config.
Blue signals trust, stability and calm, which is why banks, healthcare and tech brands lean on it. It lowers perceived stress and reads as dependable and professional.
Blue palettes often build on shades like #E3F2FD, #64B5F6, #1565C0, #0D47A1, #1A237E. Click any palette above to copy its hex codes, CSS, or Tailwind values straight into your project — combine lighter tints for backgrounds with deeper tones for text and accents.