Back to palettes

Palette

Cobalt Night Dream

A mystical journey through a deep indigo night sky, illuminated by faint starlight.

DarkCalm5 colors
More Dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Cobalt Night Dream reads on buttons, badges, and alerts before you commit.

This alert border and accent use the palette's detail color.

Marketing banner

Launch

Built with Cobalt Night Dream.

A bolder treatment that stretches the primary and secondary colors across a full gradient banner.

Data visualization

#00008B#4169E1#191970#6A5ACD#ADD8E6

Palette guide

How to use Cobalt Night Dream

Overview

The Cobalt Night Dream palette offers a mystical journey through a deep indigo night sky, illuminated by faint starlight. With hues ranging from the profound #00008B to the delicate #ADD8E6, this palette is perfect for designs evoking calm, mystery, and a touch of ethereal beauty. Designers can leverage #191970 as a strong primary, while #4169E1 offers a vivid mid-tone for dynamic elements. The unique #6A5ACD adds a hint of lavender. This palette is ideal for projects that aim to combine classic depth with a dreamy, inviting appeal, from creative branding to artistic presentations.

Best used for

  • Spiritual and wellness apps
  • Astrology and mystical themed websites
  • Luxury sleepwear or bedding brands
  • Dream interpretation platforms
  • Artistic portfolio and gallery designs
  • Elegant event invitations

Suggested color roles

primary

#191970 - A deep, sophisticated navy that establishes authority and elegance, ideal for main headings, brand logos, or foundational UI elements.

secondary

#4169E1 - A vibrant, true blue that provides an energetic contrast, suitable for subheadings, active states, or supporting graphical elements.

accent

#ADD8E6 - A very light, airy blue that offers a crisp highlight, perfect for interactive elements, small icons, or subtle background textures, evoking starlight.

background

#00008B - An intense, dark navy that creates a deep, luxurious backdrop, allowing lighter blues to truly pop with vibrancy.

text

For text on #00008B or #191970, use #ADD8E6 or white for optimal readability. For text on #ADD8E6, use black or #00008B.

Accessibility notes

  • Ensure high contrast when placing light text, such as #ADD8E6, on darker blues like #00008B or #191970.
  • Avoid using #6A5ACD for small text on #4169E1 without verifying WCAG AA compliance due to similar luminance values.
  • The brightest hue, #ADD8E6, offers excellent contrast against all darker blues in the palette for interactive elements.
  • When using #ADD8E6 as a background, ensure text is in a contrasting dark color like black or #00008B to maintain legibility.

Recommended combinations

Night Sky

Creates a striking, elegant interface; #00008B for background, #4169E1 for content, #ADD8E6 for bright highlights/CTAs.

#00008B · #4169E1 · #ADD8E6

Dream Weave

Use #191970 for main sections, #6A5ACD for supporting elements, and #ADD8E6 for vibrant accents or delicate details.

#191970 · #6A5ACD · #ADD8E6

Indigo Depths

Ideal for creating depth through gradients or layered UI, moving from the deepest navy to a rich, true blue.

#00008B · #191970 · #4169E1

CSS variables

:root {
  --cobalt-night-dream-1: #00008B;
  --cobalt-night-dream-2: #4169E1;
  --cobalt-night-dream-3: #191970;
  --cobalt-night-dream-4: #6A5ACD;
  --cobalt-night-dream-5: #ADD8E6;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "cobalt-night-dream": {
        1: "#00008B",
        2: "#4169E1",
        3: "#191970",
        4: "#6A5ACD",
        5: "#ADD8E6",
      }
    }
  }
}

Related searches

deep indigo night palettemystical blue color schemedreamy blue brandingnavy and lavender colorscalm dark UI design

Palette colors

Hex values

Color 1#00008B
·
Color 2#4169E1
·
Color 3#191970
·
Color 4#6A5ACD
·
Color 5#ADD8E6
·

Accessibility

Contrast checker

1
2
3
4
5
1
3.2:1AA18
1:1Fail
2.9:1Fail
10:1AAA
2
3.2:1AA18
3.1:1AA18
1.1:1Fail
3.2:1AA18
3
1:1Fail
3.1:1AA18
2.8:1Fail
9.7:1AAA
4
2.9:1Fail
1.1:1Fail
2.8:1Fail
3.5:1AA18
5
10:1AAA
3.2:1AA18
9.7:1AAA
3.5:1AA18

Similar palettes

More like Cobalt Night Dream

View all Dark
Celestial Ocean Depth
Deep Forest Seclusion
Enchanted Garden Pond
Midnight Ocean Depths
Pine Needle Carpet
Abyssal Bioluminescence