Back to palettes

Palette

Midnight Star Veil

Deep, mysterious blues and greys mirroring the vast, starlit expanse of a clear night sky.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Midnight Star Veil 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 Midnight Star Veil.

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

Data visualization

#1A1A2E#2B3A55#4A607C#718BAD#0E121E

Palette guide

How to use Midnight Star Veil

Overview

The Midnight Star Veil palette (version 2) presents a series of deep, cool blue-grays, creating a serene, profound, and sophisticated atmosphere reminiscent of a starlit night. Starting with the profound #0E121E, it progresses through #1A1A2E and #2B3A55, reaching the gentle luminosity of #718BAD. This collection is expertly curated for designers and developers seeking a tranquil yet impactful dark theme. Its harmonious shades are ideal for corporate dashboards, tech branding, or any digital product aiming for a clean, professional look with a touch of cosmic elegance, ensuring excellent visual hierarchy and user comfort.

Best used for

  • Corporate dashboards and analytics platforms
  • Tech company branding and websites
  • Educational platforms with dark mode
  • Tranquil meditation or wellness apps
  • Night mode interfaces for news apps
  • Professional digital presentations

Suggested color roles

primary

Utilize #0E121E as the core dark background, establishing a deep and stable foundation for the design.

secondary

Employ #1A1A2E for main content areas, cards, or navigation, providing a subtle lift from the deepest background.

accent

Reserve #718BAD for interactive elements, highlights, or subtle graphical accents to guide user attention.

background

The deep #0E121E or #1A1A2E creates a sophisticated and calming backdrop, ideal for extended viewing.

text

For optimal readability on dark backgrounds, use #718BAD for body text. For headings, a crisp white or light gray like #F0F0F0 works well.

Accessibility notes

  • Ensure #718BAD text on #0E121E or #1A1A2E meets WCAG AA contrast standards for body text.
  • Avoid using #2B3A55 on #1A1A2E for small text, as the contrast may not be sufficient for readability.
  • For larger headlines or decorative text, #4A607C on #1A1A2E can be effective.
  • If designing for light mode, use #0E121E or #1A1A2E as text colors on a white or near-white background.

Recommended combinations

Deep Blue Base

Forms a robust dark theme foundation, suitable for overall site design with clear text contrast.

#0E121E · #1A1A2E · #718BAD

Layered Blues

Perfect for creating subtle depth and hierarchy in UI elements like modals, cards, or sidebars.

#1A1A2E · #2B3A55 · #4A607C

Highlight Contrast

Use for prominent call-to-action buttons or key information where the lightest color needs to stand out.

#0E121E · #718BAD · #4A607C

CSS variables

:root {
  --midnight-star-veil-2-1: #1A1A2E;
  --midnight-star-veil-2-2: #2B3A55;
  --midnight-star-veil-2-3: #4A607C;
  --midnight-star-veil-2-4: #718BAD;
  --midnight-star-veil-2-5: #0E121E;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-star-veil-2": {
        1: "#1A1A2E",
        2: "#2B3A55",
        3: "#4A607C",
        4: "#718BAD",
        5: "#0E121E",
      }
    }
  }
}

Related searches

deep blue gray palettedark cosmic themeserene night colorstech blue UIsophisticated dark blue

Palette colors

Hex values

Color 1#1A1A2E
·
Color 2#2B3A55
·
Color 3#4A607C
·
Color 4#718BAD
·
Color 5#0E121E
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.6:1Fail
4.9:1AA
1.1:1Fail
2
1.5:1Fail
1.8:1Fail
3.3:1AA18
1.6:1Fail
3
2.6:1Fail
1.8:1Fail
1.8:1Fail
2.9:1Fail
4
4.9:1AA
3.3:1AA18
1.8:1Fail
5.3:1AA
5
1.1:1Fail
1.6:1Fail
2.9:1Fail
5.3:1AA

Similar palettes

More like Midnight Star Veil

View all dark
Midnight Stellar Glow
Deep Space Abyss
Midnight Celestial Bloom
Midnight Star Veil
Starry Night Canvas
Starry Night Embrace