Back to palettes

Palette

Deep Opal Flash

Deep, enigmatic blues and purples, reflecting the hidden, fiery glint of an opal in profound darkness.

darkdark5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Deep Opal Flash 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 Deep Opal Flash.

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

Data visualization

#0A0A2A#2E0854#4B0082#7A2E80#A020F0

Palette guide

How to use Deep Opal Flash

Overview

The Deep Opal Flash palette features deep, enigmatic blues and purples, reflecting the hidden, fiery glint of an opal in profound darkness. Ranging from the mysterious #0A0A2A to the vibrant #A020F0, this palette is ideal for designs that seek to evoke magic, luxury, and a sense of the mystical. Designers can craft immersive digital experiences, captivating branding, and unique UI themes. Developers will find these hex codes perfect for projects related to fantasy, high-end products, or any application that benefits from a rich, jewel-toned aesthetic. The dynamic interplay between #2E0854 and #4B0082 allows for stunning visual depth and hierarchy.

Best used for

  • Fantasy game interfaces or branding
  • Luxury cosmetics or jewelry websites
  • Astrology or spiritual wellness apps
  • Event branding for exclusive parties
  • Creative portfolio sites
  • Music album artwork

Suggested color roles

primary

Utilize #2E0854 as the main background or primary content color, providing a deep, mystical, and stable foundation.

secondary

Apply #4B0082 for secondary content areas, panels, or navigation, offering a rich visual distinction and layered effect.

accent

Introduce #A020F0 as a powerful, luminous accent for calls-to-action, key features, or interactive elements, ensuring maximum impact.

background

The deepest hue, #0A0A2A, is excellent for expansive backgrounds or header sections, establishing an immediate tone of profound mystery.

text

For optimal readability, use a crisp white or very light gray. #A020F0 can be used for larger headings or highlights on the darkest backgrounds.

Accessibility notes

  • Ensure high contrast for text on #0A0A2A, #2E0854, and #4B0082 by using light text (e.g., white or #A020F0).
  • The lighter color, #A020F0, provides excellent contrast for primary text against all darker blues and purples in the palette.
  • Avoid using #0A0A2A and #2E0854 for small text or critical UI elements in close proximity without careful contrast checks.
  • Always test color combinations with accessibility tools to ensure WCAG compliance for readability.

Recommended combinations

Mystic Depths

Ideal for creating a layered, dark background or card system, conveying deep mystery and elegance.

#0A0A2A · #2E0854 · #4B0082

Opal Glow

Use #2E0854 as a base, with #7A2E80 for secondary elements and #A020F0 for vibrant, jewel-like highlights or interactive states.

#2E0854 · #7A2E80 · #A020F0

Deep Flash

Excellent for a dark, profound background with a clear, electric accent and a strong mid-tone for supporting details.

#0A0A2A · #A020F0 · #4B0082

CSS variables

:root {
  --deep-opal-flash-1: #0A0A2A;
  --deep-opal-flash-2: #2E0854;
  --deep-opal-flash-3: #4B0082;
  --deep-opal-flash-4: #7A2E80;
  --deep-opal-flash-5: #A020F0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "deep-opal-flash": {
        1: "#0A0A2A",
        2: "#2E0854",
        3: "#4B0082",
        4: "#7A2E80",
        5: "#A020F0",
      }
    }
  }
}

Related searches

deep purple color palettemystic blue hex codesjewel tone dark themeluxury purple UI designopal inspired colors

Palette colors

Hex values

Color 1#0A0A2A
·
Color 2#2E0854
·
Color 3#4B0082
·
Color 4#7A2E80
·
Color 5#A020F0
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.2:1Fail
1.5:1Fail
2.3:1Fail
3.6:1AA18
2
1.2:1Fail
1.3:1Fail
2:1Fail
3.1:1AA18
3
1.5:1Fail
1.3:1Fail
1.6:1Fail
2.4:1Fail
4
2.3:1Fail
2:1Fail
1.6:1Fail
1.6:1Fail
5
3.6:1AA18
3.1:1AA18
2.4:1Fail
1.6:1Fail

Similar palettes

More like Deep Opal Flash

View all dark