Palette · blue · saas · light

Azure

Crisp white with a bright sky-blue primary and an indigo accent — the clean, trustworthy default of modern SaaS marketing sites.

Copy as

Building with shadcn/ui?

Install Azure as a real theme — light and dark, OKLCH tokens, contrast checked.

Get the theme →

Usage system

Everything you need to wire this palette into a real project, not just the colors.

CSS variables
:root {
  --color-bg: #FFFFFF;
  --color-surface: #F8FAFC;
  --color-primary: #0284C7;
  --color-accent: #6366F1;
  --color-text: #0F172A;
  --color-muted: #64748B;
}
Tailwind config
// tailwind.config.js
module.exports = {
  theme: {
    extend: {
      colors: {
        bg: '#FFFFFF',
        surface: '#F8FAFC',
        primary: '#0284C7',
        accent: '#6366F1',
        text: '#0F172A',
        muted: '#64748B',
      },
    },
  },
};
Font pairing Inter / heading · Inter / body
Corner radius 10px
Spacing scale 4px base · 4 / 8 / 12 / 16 / 24 / 32 / 48

In context

New

Build better, faster

A card, a heading, a button and a hint of text: the palette doing real work.

Found one you like? Pair it with a template, generate a matching background in the gradient generator, or browse all palettes.