Ocean Palette

CSS variables

:root {
  --color-1: #0077B6;
  --color-2: #00B4D8;
  --color-3: #90E0EF;
  --color-4: #CAF0F8;
  --color-5: #023E8A;
}

Tailwind config

// tailwind.config.js
colors: {
  "ocean-1": "#0077B6",
  "ocean-2": "#00B4D8",
  "ocean-3": "#90E0EF",
  "ocean-4": "#CAF0F8",
  "ocean-5": "#023E8A",
}

About this palette

The Ocean palette is a curated set of 5 colors with their HEX, RGB and ready CSS-variable and Tailwind exports. Click any swatch for that color's full breakdown — conversions, contrast and harmonies.

More palettes