Palette

Grapevine Harvest Gala

Deep, luxurious purples inspired by ripe grapes and the festive atmosphere of a harvest gala.

vibrantelegant5 colors

More vibrant palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Grapevine Harvest Gala 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 Grapevine Harvest Gala.

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

Data visualization

#5C2D5C#800080#BA55D3#3D1E3D#A94ECA

Palette guide

How to use Grapevine Harvest Gala

Overview

The Grapevine Harvest Gala palette offers a luxurious collection of deep, rich purples, perfect for designs aiming for elegance and festive sophistication. Inspired by ripe grapes and celebratory evenings, this palette features a spectrum from the profound #3D1E3D and #5C2D5C to the vibrant #800080, #A94ECA, and #BA55D3. Designers can leverage these hues to create an atmosphere of opulence and depth. Developers will find these tones excellent for crafting user interfaces that exude a premium feel, particularly in luxury branding, event promotions, or high-end product showcases, ensuring a memorable visual experience. Its inherent richness makes it versatile for both bold statements and subtle, elegant touches.

Best used for

Luxury brand identity and packaging
High-end event invitations and decor (weddings, galas)
Wine and spirits branding and marketing
Fashion and beauty product websites and campaigns
E-commerce platforms for premium goods
Festive digital marketing campaigns and seasonal themes

Suggested color roles

primary

#5C2D5C This deep, sophisticated purple serves as an excellent foundation, ideal for main content areas, primary buttons, or brand logos, conveying elegance and stability.

secondary

#800080 A classic royal purple, perfect for supporting elements, subheadings, or secondary calls to action, adding a touch of traditional luxury without overpowering.

accent

#BA55D3 This brighter, more vibrant purple provides a lively pop, best used for interactive elements, highlights, or small decorative details to draw attention.

background

#3D1E3D A very dark, almost black-purple, this hue is superb for creating deep, rich backgrounds that provide a sophisticated contrast for lighter elements and text.

text

Use a crisp white or very light gray (e.g., #F8F8F8) for primary text on darker backgrounds like #3D1E3D or #5C2D5C to ensure maximum readability and a luxurious feel.

Accessibility notes

Ensure sufficient contrast (AA or AAA) for text against all background colors, especially lighter purples on medium purples.
Pair light text (e.g., white) with dark backgrounds like #3D1E3D or #5C2D5C for optimal readability and a premium aesthetic.
Avoid using #BA55D3 or #A94ECA for extensive body text, as their vibrancy can strain eyes; reserve them for accents.
Be mindful of color-coding information; rely on more than just color difference due to the monochromatic nature of the palette for users with color vision deficiencies.

Recommended combinations

Royal Depth

Ideal for creating elegant website headers, sophisticated navigation menus, or prominent calls to action in luxury applications, offering strong contrast.

#3D1E3D · #5C2D5C · #BA55D3

Vibrant Harmony

Excellent for festive event promotions, hero sections demanding attention, or interactive elements in a lively, upscale digital experience, balancing vibrancy with depth.

#800080 · #A94ECA · #5C2D5C

Subtle Richness

Best suited for background layers, subtle branding elements, or darker UI components where depth and understated elegance are desired without high contrast.

#5C2D5C · #3D1E3D · #800080

CSS variables

:root {
  --grapevine-harvest-gala-1: #5C2D5C;
  --grapevine-harvest-gala-2: #800080;
  --grapevine-harvest-gala-3: #BA55D3;
  --grapevine-harvest-gala-4: #3D1E3D;
  --grapevine-harvest-gala-5: #A94ECA;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "grapevine-harvest-gala": {
        1: "#5C2D5C",
        2: "#800080",
        3: "#BA55D3",
        4: "#3D1E3D",
        5: "#A94ECA",
      }
    }
  }
}

Hex values

Color 1#5C2D5C

Color 2#800080

Color 3#BA55D3

Color 4#3D1E3D

Color 5#A94ECA

Accessibility

Contrast checker

1.1:1Fail

2.7:1Fail

1.4:1Fail

2.3:1Fail

1.1:1Fail

2.4:1Fail

1.5:1Fail

2.1:1Fail

2.7:1Fail

2.4:1Fail

3.7:1AA18

1.2:1Fail