Palette

Velvet Plum Twilight

Deep, luxurious purples fading into soft lavenders, like the hush of twilight in a royal chamber.

darkelegant5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Velvet Plum 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 Velvet Plum Twilight.

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

Data visualization

#2F1735#4E2F5B#7D4C92#B174CE#E9C9F9

Palette guide

How to use Velvet Plum Twilight

Overview

The Velvet Plum Twilight palette captures the enchanting transition from deep twilight purples to soft, ethereal lavenders. Starting with the profound #2F1735, it flows through the rich #4E2F5B and the captivating #7D4C92, lightening to the luminous #B174CE and the delicate #E9C9F9. This palette is ideal for creating designs that exude mystery, luxury, and a touch of magic. It offers a sophisticated gradient from dark to light, perfect for evoking a serene yet glamorous atmosphere across various creative applications.

Best used for

luxury event branding
mystical digital illustrations
high-end fashion editorials
cosmetics and beauty products
spiritual or wellness websites
elegant interior accents

Suggested color roles

primary

#2F1735 serves as a profound, anchoring dark purple, perfect for sophisticated backgrounds or powerful branding.

secondary

#4E2F5B offers a rich, supportive mid-tone, ideal for secondary elements, shadows, or deeper content blocks.

accent

#B174CE or #E9C9F9 provides a luminous, ethereal accent, excellent for highlights, call-to-actions, or delicate details.

background

Use #E9C9F9 for a soft, ambient background, or #2F1735 for a dramatic, immersive experience with light text.

text

For light backgrounds like #E9C9F9, a deep charcoal or black is best. Against darker shades, pure white or a very light gray ensures readability.

Accessibility notes

Ensure sufficient contrast between #E9C9F9 and #B174CE for text, favoring larger sizes or darker shades for readability.
Text against #7D4C92 may require careful testing; white or a very light gray is generally safe.
Avoid using #B174CE directly on #E9C9F9 for small text or thin lines due to potential low contrast.
Verify that interactive elements have clear visual states, especially when using similar mid-tones.

Recommended combinations

Deep Mystery

Creates a luxurious, shadowy depth, ideal for backgrounds, headers, or dramatic visual storytelling.

#2F1735 · #4E2F5B · #7D4C92

Twilight Glow

Offers a soft, ethereal gradient, perfect for subtle highlights, illustrations, or dreamy interfaces.

#7D4C92 · #B174CE · #E9C9F9

Glamorous Contrast

Combines the deepest tone with the lightest accents for a striking and sophisticated visual dynamic.

#2F1735 · #B174CE · #E9C9F9

CSS variables

:root {
  --velvet-plum-twilight-1: #2F1735;
  --velvet-plum-twilight-2: #4E2F5B;
  --velvet-plum-twilight-3: #7D4C92;
  --velvet-plum-twilight-4: #B174CE;
  --velvet-plum-twilight-5: #E9C9F9;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "velvet-plum-twilight": {
        1: "#2F1735",
        2: "#4E2F5B",
        3: "#7D4C92",
        4: "#B174CE",
        5: "#E9C9F9",
      }
    }
  }
}

Hex values

Color 1#2F1735

Color 2#4E2F5B

Color 3#7D4C92

Color 4#B174CE

Color 5#E9C9F9

Accessibility

Contrast checker

1.5:1Fail

2.6:1Fail

4.8:1AA

11:1AAA

1.5:1Fail

1.8:1Fail

3.3:1AA18

7.5:1AAA

2.6:1Fail

1.8:1Fail

1.9:1Fail

4.3:1AA18

4.8:1AA

3.3:1AA18

1.9:1Fail

2.3:1Fail

11:1AAA

7.5:1AAA

4.3:1AA18

2.3:1Fail

Similar palettes

More like Velvet Plum Twilight

View all dark

Royal Gem Twilight

Amethyst Veil Mystique

Ancient Geode Vein

Baroque Velvet Plum

Blackberry Bramble Luxe

Celestial Whisper Nebula