Dark Blue UI Color Palettes

How to use these palettes

Start with the primary and surface colors, then test text contrast before exporting. These palettes are most useful for fintech apps, productivity products, and technical dashboards. Use navy as the base and reserve electric blue for navigation state and primary actions.

Each dark palette keeps text near-white and checks primary actions against the dark surface so dashboard labels remain readable.

CSS Variables

:root {
  --primary: #C327CE;
  --accent: #D65198;
  --surface: #211220;
  --text: #F7F3F7;
  --support: #C9C373;
}