Palette

Gemstone Grotto Shimmer

A deep, mystical shimmer, like the inner glow of hidden amethyst crystals in a dark cavern.

coolelegant5 colors

More cool palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Gemstone Grotto Shimmer 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 Gemstone Grotto Shimmer.

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

Data visualization

#4D265A#7A3F8B#AE6FC7#D7A6EB#F2DCF9

Palette guide

How to use Gemstone Grotto Shimmer

Overview

This "Gemstone Grotto Shimmer" palette offers a luxurious journey into deep purples, evoking the hidden brilliance of amethyst crystals. Anchored by the profound #4D265A, it transitions through the rich #7A3F8B and vibrant #AE6FC7, culminating in the ethereal #D7A6EB and delicate #F2DCF9. Designers can leverage this spectrum to create sophisticated, mystical interfaces or branding that demands attention. Developers will find these hues ideal for crafting elegant UI elements, gradients, or dark mode themes where depth and subtle glow are desired. Its cool, deep tones are perfect for conveying luxury, mystery, and an artistic flair in digital and print media.

Best used for

Luxury brand websites and apps
Mystical or fantasy-themed game interfaces
High-end event invitations and decor
Elegant fashion or jewelry e-commerce
Art gallery digital presentations
Spa and wellness branding

Suggested color roles

primary

#4D265A - Ideal for main backgrounds, navigation bars, or strong header elements where depth and luxury are paramount.

secondary

#7A3F8B - Excellent for prominent sections, hero banners, or interactive states, providing a rich contrast to the primary.

accent

#AE6FC7 - Use for calls-to-action, key icons, or highlighted text to draw attention with its vibrant, jewel-like quality.

background

#F2DCF9 - A very light, almost white, base for main content areas, offering a soft, ethereal canvas.

text

#4D265A - Best for dark text on light backgrounds like #F2DCF9, ensuring strong readability. Alternatively, use white or a very light gray on darker shades.

Accessibility notes

Ensure sufficient contrast when using #F2DCF9 as a background, especially with lighter text.
Text in #4D265A on #F2DCF9 offers good contrast for body copy.
Avoid placing #D7A6EB directly on #F2DCF9 for critical information due to low contrast.
Use #AE6FC7 as an accent on dark backgrounds like #4D265A for strong visual pop and readability.

Recommended combinations

Deep Amethyst

Perfect for sophisticated hero sections or impactful branding, conveying depth and elegance.

#4D265A · #7A3F8B · #AE6FC7

Shimmer Gradient

Create subtle, glowing gradients for backgrounds, overlays, or interactive elements.

#AE6FC7 · #D7A6EB · #F2DCF9

Dark Contrast

A strong dark-on-light base, with a rich purple for emphasis in UI components.

#4D265A · #F2DCF9 · #7A3F8B

CSS variables

:root {
  --gemstone-grotto-shimmer-1: #4D265A;
  --gemstone-grotto-shimmer-2: #7A3F8B;
  --gemstone-grotto-shimmer-3: #AE6FC7;
  --gemstone-grotto-shimmer-4: #D7A6EB;
  --gemstone-grotto-shimmer-5: #F2DCF9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "gemstone-grotto-shimmer": {
        1: "#4D265A",
        2: "#7A3F8B",
        3: "#AE6FC7",
        4: "#D7A6EB",
        5: "#F2DCF9",
      }
    }
  }
}

Hex values

Color 1#4D265A

Color 2#7A3F8B

Color 3#AE6FC7

Color 4#D7A6EB

Color 5#F2DCF9

Accessibility

Contrast checker

1.7:1Fail

3.4:1AA18

6.1:1AA

9.4:1AAA

1.7:1Fail

2:1Fail

3.6:1AA18

5.6:1AA

3.4:1AA18

2:1Fail

1.8:1Fail

2.8:1Fail

6.1:1AA

3.6:1AA18

1.8:1Fail

1.6:1Fail

9.4:1AAA

5.6:1AA

2.8:1Fail

1.6:1Fail

Similar palettes

More like Gemstone Grotto Shimmer

View all cool

Amethyst Cavern Glow

Amethyst Geode Sparkle

Amethyst Mystic Grotto

Aqua Jewel

Celestial Ocean Depth

Kyanite Luster