Back to palettes

Palette

Royal Gem Twilight

Deep, rich purples reminiscent of royal jewels at twilight, exuding an air of majestic mystery.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Royal Gem Twilight 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 Royal Gem Twilight.

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

Data visualization

#36013F#6A1A70#9B309D#C95AC9#E49FE4

Palette guide

How to use Royal Gem Twilight

Overview

The Royal Gem Twilight palette presents a captivating spectrum of deep, rich purples, evoking the majestic mystery of royal jewels at dusk. Ranging from the profound #36013F to the slightly lighter #6A1A70, it transitions through the vibrant #9B309D and the elegant #C95AC9, culminating in the soft yet sophisticated #E49FE4. This collection is ideal for designs that seek to convey luxury, sophistication, and a touch of enigmatic charm. Designers can leverage these hues for high-end branding, elegant web interfaces, or captivating print materials, creating a visually cohesive and memorable experience that resonates with refinement and depth.

Best used for

  • Luxury fashion and beauty brands
  • High-end event or gala invitations
  • Creative and artistic portfolios
  • Mystical or fantasy-themed designs
  • Elegant website interfaces
  • Jewelry brand marketing materials

Suggested color roles

primary

Use #36013F as a dominant, deep background or primary brand color for a luxurious, mysterious feel.

secondary

Apply #6A1A70 for supporting elements, subheadings, or darker UI components, adding depth.

accent

Introduce #C95AC9 for vibrant accents, call-to-actions, or highlights that need to stand out elegantly.

background

The deep #36013F or #6A1A70 creates a dramatic, regal backdrop for light-colored content.

text

White or a very light gray provides excellent contrast. For lighter backgrounds, use a deep charcoal or #36013F.

Accessibility notes

  • Ensure high contrast when pairing the darker purples with white or light text for readability.
  • Avoid using #E49FE4 for small text on #C95AC9 backgrounds due to potential contrast issues.
  • Always check that text and background color combinations meet WCAG AA standards.
  • Use a contrast checker to verify all critical text elements are accessible across the palette.

Recommended combinations

Twilight Depth

Perfect for creating rich, layered backgrounds, headers, or sophisticated brand elements.

#36013F · #6A1A70 · #9B309D

Gemstone Sparkle

Ideal for vibrant accents, interactive elements, or illustrations that need to catch the eye.

#C95AC9 · #E49FE4 · #9B309D

Regal Gradient

Use for smooth transitions in backgrounds, graphic elements, or subtle branding effects.

#6A1A70 · #9B309D · #C95AC9

CSS variables

:root {
  --royal-gem-twilight-1: #36013F;
  --royal-gem-twilight-2: #6A1A70;
  --royal-gem-twilight-3: #9B309D;
  --royal-gem-twilight-4: #C95AC9;
  --royal-gem-twilight-5: #E49FE4;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "royal-gem-twilight": {
        1: "#36013F",
        2: "#6A1A70",
        3: "#9B309D",
        4: "#C95AC9",
        5: "#E49FE4",
      }
    }
  }
}

Related searches

deep purple color schemesroyal jewel tonestwilight purple paletteelegant dark purple colorsmajestic purple branding

Palette colors

Hex values

Color 1#36013F
·
Color 2#6A1A70
·
Color 3#9B309D
·
Color 4#C95AC9
·
Color 5#E49FE4
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.6:1Fail
2.7:1Fail
4.7:1AA
8.4:1AAA
2
1.6:1Fail
1.7:1Fail
2.9:1Fail
5.2:1AA
3
2.7:1Fail
1.7:1Fail
1.8:1Fail
3.1:1AA18
4
4.7:1AA
2.9:1Fail
1.8:1Fail
1.8:1Fail
5
8.4:1AAA
5.2:1AA
3.1:1AA18
1.8:1Fail

Similar palettes

More like Royal Gem Twilight

View all dark
Amethyst Veil Mystique
Regal Gemstone Cascade
Rich Gem Velvet
Velvet Midnight Opera
Baroque Jewel Box
Baroque Velvet Plum