Back to palettes

Palette

Midnight Plum

Rich, opulent purples that evoke the deep, luxurious shades of ripe plums under a moonless night sky.

darkelegant5 colors
More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#4F265C#6F3E7C#9A69A9#3D1E4A#5D316B

Palette guide

How to use Midnight Plum

Overview

The Midnight Plum palette offers a rich collection of deep, sophisticated purples, evoking the luxurious shades of ripe plums under a moonless night. Comprising #4F265C, #6F3E7C, #9A69A9, #3D1E4A, and #5D316B, this palette provides a harmonious range for designs seeking a refined, mysterious, and elegant aesthetic. It's genuinely useful for designers and developers aiming to create a sense of depth and understated opulence in their visual projects, from corporate branding to digital interfaces.

Best used for

  • Corporate branding with a refined edge
  • Editorial design and publishing
  • Upscale product design and packaging
  • Digital dashboards and data visualization
  • Academic and professional presentations
  • Sophisticated web interfaces and applications

Suggested color roles

primary

Anchor your design with #3D1E4A (deepest plum) for a solid, grounding presence.

secondary

Use #4F265C (rich, supporting mid-tone plum) for secondary headings or background variations.

accent

Apply #9A69A9 (lighter, subtle lavender-plum) for delicate highlights or interactive elements.

background

Utilize #3D1E4A for a dark, professional background that conveys depth.

text

For readability, use #9A69A9 or a light gray/off-white on the darker plum backgrounds.

Accessibility notes

  • The palette is quite close-knit; ensure #9A69A9 text has sufficient contrast against #3D1E4A or #4F265C.
  • Avoid using #5D316B as text on #4F265C, as contrast will likely be insufficient for readability.
  • For optimal readability, consider pairing the lightest color, #9A69A9, with the darkest, #3D1E4A.
  • A true white or very light gray might be necessary for body text on the darker shades to meet WCAG standards.

Recommended combinations

Subtle Depth

Creating harmonious and understated layouts for professional documents or websites.

#3D1E4A · #4F265C · #9A69A9

Refined Contrast

Achieving a balanced and elegant look for headers and key information.

#3D1E4A · #9A69A9 · #6F3E7C

Muted Harmony

For gentle, sophisticated backgrounds or layered graphic elements.

#4F265C · #5D316B · #9A69A9

CSS variables

:root {
  --midnight-plum-1: #4F265C;
  --midnight-plum-2: #6F3E7C;
  --midnight-plum-3: #9A69A9;
  --midnight-plum-4: #3D1E4A;
  --midnight-plum-5: #5D316B;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "midnight-plum": {
        1: "#4F265C",
        2: "#6F3E7C",
        3: "#9A69A9",
        4: "#3D1E4A",
        5: "#5D316B",
      }
    }
  }
}

Related searches

muted plum colorssophisticated purple paletteprofessional dark purpleselegant berry huesmysterious deep purple

Palette colors

Hex values

Color 1#4F265C
·
Color 2#6F3E7C
·
Color 3#9A69A9
·
Color 4#3D1E4A
·
Color 5#5D316B
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.5:1Fail
2.8:1Fail
1.2:1Fail
1.2:1Fail
2
1.5:1Fail
1.9:1Fail
1.8:1Fail
1.3:1Fail
3
2.8:1Fail
1.9:1Fail
3.3:1AA18
2.3:1Fail
4
1.2:1Fail
1.8:1Fail
3.3:1AA18
1.4:1Fail
5
1.2:1Fail
1.3:1Fail
2.3:1Fail
1.4:1Fail

Similar palettes

More like Midnight Plum

View all dark
Regal Amethyst Velvet
Blackberry Bramble Luxe
Elderberry Preserve
Gothic Rose Window
Grape Escape
Imperial Velvet