Palette

Mineral Vein Radiance

Shimmering purples, from soft lavender to deep amethyst, inspired by a sparkling geode.

pastelelegant5 colors

More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Mineral Vein Radiance 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 Mineral Vein Radiance.

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

Data visualization

#E9D8F2#C6A7DA#9D74BD#7A4D9F#5D367A

Palette guide

How to use Mineral Vein Radiance

Overview

The Mineral Vein Radiance palette presents a shimmering array of purples, from soft lavender to deep amethyst, inspired by a sparkling geode. It features the ethereal #E9D8F2, transitioning through #C6A7DA, #9D74BD, and #7A4D9F, culminating in the profound #5D367A. This elegant and mystical scheme is perfect for designers and developers aiming to create luxurious, spiritual, or high-end designs. It lends itself beautifully to branding, digital interfaces, and artistic projects that evoke precious gems, inner calm, and refined beauty across various applications, from fashion to wellness.

Best used for

Jewelry brand websites and e-commerce
Spa and beauty product packaging
Spiritual or wellness content platforms
Elegant event invitations and branding
Luxury fashion editorial designs
Digital art with a mystical or crystal theme

Suggested color roles

primary

Use #5D367A as the deepest amethyst, serving as a primary background or dominant color for an elegant foundation.

secondary

Employ #7A4D9F for supporting sections, sub-headers, or layered UI components, adding rich, mid-tone purple.

accent

Apply #E9D8F2 sparingly for delicate highlights, decorative elements, or interactive components, evoking soft radiance.

background

Utilize #E9D8F2 as a light and airy background, allowing the deeper purples to stand out elegantly.

text

Use #5D367A for all primary text on lighter backgrounds to ensure optimal readability. #9D74BD can be used for headings.

Accessibility notes

#5D367A provides excellent contrast for text on #E9D8F2 and #C6A7DA, making it ideal for readability.
Avoid using #7A4D9F or #9D74BD for small body text directly on #C6A7DA due to potentially low contrast.
Ensure sufficient contrast for all text, especially when using lighter purples on other light purples within the palette.
Reserve #E9D8F2 for backgrounds or large UI elements, always using darker purples or a dark gray for text on this hue.

Recommended combinations

Amethyst Glow

Ideal for main branding, headlines, and body text, creating an elegant, readable, and sophisticated design.

#E9D8F2 · #5D367A · #9D74BD

Gemstone Depth

Excellent for layered backgrounds, subtle gradients, or creating visual depth in illustrations and UI components.

#5D367A · #7A4D9F · #9D74BD

Lavender Accent

Perfect for call-to-action buttons, delicate highlights, or navigational elements that require a touch of elegance.

#C6A7DA · #E9D8F2 · #5D367A

CSS variables

:root {
  --mineral-vein-radiance-1: #E9D8F2;
  --mineral-vein-radiance-2: #C6A7DA;
  --mineral-vein-radiance-3: #9D74BD;
  --mineral-vein-radiance-4: #7A4D9F;
  --mineral-vein-radiance-5: #5D367A;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "mineral-vein-radiance": {
        1: "#E9D8F2",
        2: "#C6A7DA",
        3: "#9D74BD",
        4: "#7A4D9F",
        5: "#5D367A",
      }
    }
  }
}

Hex values

Color 1#E9D8F2

Color 2#C6A7DA

Color 3#9D74BD

Color 4#7A4D9F

Color 5#5D367A

Accessibility

Contrast checker

1.6:1Fail

2.7:1Fail

4.6:1AA

6.8:1AA

1.6:1Fail

1.8:1Fail

2.9:1Fail

4.4:1AA18

2.7:1Fail

1.8:1Fail

1.7:1Fail

2.5:1Fail

4.6:1AA

2.9:1Fail

1.7:1Fail

1.5:1Fail

6.8:1AA

4.4:1AA18

2.5:1Fail

1.5:1Fail

Similar palettes

More like Mineral Vein Radiance

View all pastel

Orchid Bloom Mystique

Orchid Bloom Serene

Whispering Orchid Glaze

Aetherial Bloom

Aged Rosewood Blush

Antique Lace Whisper