Back to palettes

Palette

Mystic Garden Bloom

A captivating mix of deep purples and muted blues, like rare flowers blooming in an enchanted twilight garden.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mystic Garden Bloom 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 Mystic Garden Bloom.

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

Data visualization

#4B0082#8A2BE2#BA55D3#4682B4#5F9EA0

Palette guide

How to use Mystic Garden Bloom

Overview

The "Mystic Garden Bloom" palette weaves a captivating narrative of an enchanted twilight garden, blending deep purples with muted blues. With hues like the rich #4B0082 and the vibrant #8A2BE2, contrasted by the softer #BA55D3, this collection exudes elegance and mystique. The integration of serene blues such as #4682B4 and #5F9EA0 adds a calming, ethereal depth, reminiscent of a moonlit pond amidst exotic blooms. This palette is exceptionally versatile for projects requiring a touch of magic, sophistication, and a harmonious balance between dramatic depth and delicate luminosity.

Best used for

  • Boutique fashion and luxury product branding
  • Elegant event invitations and decor
  • Spiritual wellness or holistic brand identity
  • Fantasy-themed digital art and illustrations
  • Creative agency websites or portfolios
  • Unique UI themes for apps and software

Suggested color roles

primary

Utilize #4B0082 as the dominant, deep purple, perfect for strong branding elements, main headings, or backgrounds to convey luxury and depth.

secondary

Apply #8A2BE2 for supporting sections, subheadings, or calls to action, providing a vibrant yet harmonious contrast to the primary hue.

accent

Introduce #BA55D3 or #4682B4 for highlights, interactive elements, or graphic details, adding a touch of luminosity and visual interest.

background

Employ #5F9EA0 or a lighter shade of blue like #4682B4 for soft, ethereal backgrounds that allow the deeper purples to truly bloom.

text

For optimal readability, use #4B0082 on lighter backgrounds. For darker backgrounds, a crisp white or very light grey will provide excellent contrast.

Accessibility notes

  • Ensure sufficient contrast when pairing #BA55D3 with lighter backgrounds; it may require larger text sizes.
  • Test text legibility for #8A2BE2 on both light and dark backgrounds to meet accessibility standards.
  • Avoid using #BA55D3 as body text on a #5F9EA0 background without careful contrast checking.
  • Use a contrasting shade like #4B0082 for critical information on lighter blues to maintain readability.

Recommended combinations

Twilight Bloom

Excellent for a sophisticated brand header or hero section, combining deep purple with a vibrant accent and a calming blue.

#4B0082 · #BA55D3 · #5F9EA0

Enchanted Waters

Ideal for backgrounds or large graphical elements, blending harmonious blues with a striking purple accent for depth.

#4682B4 · #5F9EA0 · #8A2BE2

Mystic Veil

Perfect for subtle UI elements or illustrative details, using a soft purple with dark text and a supportive blue.

#BA55D3 · #4B0082 · #4682B4

CSS variables

:root {
  --mystic-garden-bloom-1: #4B0082;
  --mystic-garden-bloom-2: #8A2BE2;
  --mystic-garden-bloom-3: #BA55D3;
  --mystic-garden-bloom-4: #4682B4;
  --mystic-garden-bloom-5: #5F9EA0;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mystic-garden-bloom": {
        1: "#4B0082",
        2: "#8A2BE2",
        3: "#BA55D3",
        4: "#4682B4",
        5: "#5F9EA0",
      }
    }
  }
}

Related searches

elegant purple blue palettemystic floral color schemetwilight garden design colorsvibrant purple brandingenchanted UI color inspiration

Palette colors

Hex values

Color 1#4B0082
·
Color 2#8A2BE2
·
Color 3#BA55D3
·
Color 4#4682B4
·
Color 5#5F9EA0
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.2:1Fail
3.3:1AA18
3.2:1AA18
4.2:1AA18
2
2.2:1Fail
1.5:1Fail
1.5:1Fail
2:1Fail
3
3.3:1AA18
1.5:1Fail
1:1Fail
1.3:1Fail
4
3.2:1AA18
1.5:1Fail
1:1Fail
1.3:1Fail
5
4.2:1AA18
2:1Fail
1.3:1Fail
1.3:1Fail

Similar palettes

More like Mystic Garden Bloom

View all dark
Midnight Iris Bloom
Cosmic Stardust Haze
Deep Indigo Inkwell
Geode Amethyst Core
Midnight Bloom Garden
Midnight Orchid Bloom