Back to palettes

Palette

Midnight Bloom Veil

Deep and enchanting, capturing the essence of flowers unfurling under a starlit night.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1A1A2E#2F0F3D#4A1A5A#6C3A8D#906DC7

Palette guide

How to use Midnight Bloom Veil

Overview

The Midnight Bloom Veil palette is deep and enchanting, capturing the essence of flowers unfurling under a starlit night. It begins with the profound #1A1A2E, transitioning through a rich gradient of purples: #2F0F3D, #4A1A5A, and #6C3A8D, culminating in the luminous #906DC7. This palette is ideal for designers and developers seeking to create elegant, mystical, and immersive digital experiences. Its deep, harmonious purples provide a strong foundation for sophisticated dark mode interfaces, luxury branding, or any project that benefits from an understated yet captivating nocturnal aesthetic. The blend offers both depth and a subtle, ethereal quality, perfect for a refined visual narrative.

Best used for

  • Luxury fashion or jewelry branding
  • Mystical or fantasy-themed web designs
  • Dark mode UI/UX for creative apps
  • Elegant event branding (e.g., galas, premieres)
  • Digital art with ethereal or nocturnal themes
  • Boutique hotel or spa website design

Suggested color roles

primary

#1A1A2E (A very deep, almost black, indigo-purple, serving as the foundational background or dominant color for a sophisticated dark theme.)

secondary

#2F0F3D (A rich, dark purple, suitable for major sections, panels, or secondary graphic elements, adding depth to the primary.)

accent

#906DC7 (The lightest, soft lavender, ideal for subtle highlights, interactive states, or delicate illustrations that need to gently stand out.)

background

#1A1A2E (Utilize this profound shade for an immersive, elegant backdrop, ensuring all lighter elements have excellent contrast and readability.)

text

#906DC7 or #6C3A8D (For body text, #906DC7 provides good contrast. For headings, #6C3A8D can offer a softer, yet still readable, option on dark backgrounds.)

Accessibility notes

  • Ensure sufficient contrast between #906DC7 text and darker backgrounds like #1A1A2E or #2F0F3D.
  • Avoid using #4A1A5A as body text on #2F0F3D due to low contrast and potential readability issues.
  • Use the lighter shades (#6C3A8D, #906DC7) for interactive elements to ensure they are clearly perceivable.
  • Consider a pure white or very light grey for critical information if the palette's lightest color doesn't meet WCAG AA standards.

Recommended combinations

Deep Enchantment

Ideal for main layouts where a strong dark base is complemented by mid-tone sections and subtle bright accents.

#1A1A2E · #4A1A5A · #906DC7

Mystic Haze

Excellent for creating depth in UI elements or illustrations, with shadows and highlights from within the palette.

#2F0F3D · #6C3A8D · #906DC7

Veiled Bloom

Suited for decorative patterns, borders, or secondary content areas that require a touch of refined elegance.

#4A1A5A · #906DC7 · #2F0F3D

CSS variables

:root {
  --midnight-bloom-veil-1: #1A1A2E;
  --midnight-bloom-veil-2: #2F0F3D;
  --midnight-bloom-veil-3: #4A1A5A;
  --midnight-bloom-veil-4: #6C3A8D;
  --midnight-bloom-veil-5: #906DC7;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-bloom-veil": {
        1: "#1A1A2E",
        2: "#2F0F3D",
        3: "#4A1A5A",
        4: "#6C3A8D",
        5: "#906DC7",
      }
    }
  }
}

Related searches

dark mystic purple paletteelegant night bloom colorsdeep indigo lavender schemesophisticated dark purpleethereal floral palette

Palette colors

Hex values

Color 1#1A1A2E
·
Color 2#2F0F3D
·
Color 3#4A1A5A
·
Color 4#6C3A8D
·
Color 5#906DC7
·

Accessibility

Contrast checker

1
2
3
4
5
1
1:1Fail
1.3:1Fail
2.1:1Fail
4.2:1AA18
2
1:1Fail
1.3:1Fail
2.1:1Fail
4.1:1AA18
3
1.3:1Fail
1.3:1Fail
1.7:1Fail
3.3:1AA18
4
2.1:1Fail
2.1:1Fail
1.7:1Fail
2:1Fail
5
4.2:1AA18
4.1:1AA18
3.3:1AA18
2:1Fail

Similar palettes

More like Midnight Bloom Veil

View all dark