Palette

Royal Jewel Brocade

Inspired by the lavish, deep hues and shimmering threads of royal brocade fabric, exuding opulence.

darkelegant5 colors

More dark palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Royal Jewel Brocade 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 Jewel Brocade.

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

Data visualization

#36013F#6B2737#A74C4D#D8A47F#B29958

Palette guide

How to use Royal Jewel Brocade

Overview

The Royal Jewel Brocade palette exudes opulence and vintage luxury, perfect for designs requiring a sophisticated touch. Featuring deep plum #36013F, rich maroon #6B2737, and a warm terracotta #A74C4D, it's balanced by a soft peach #D8A47F and an antique gold #B29958. This collection of jewel tones and muted metallics is ideal for creating a lavish atmosphere. Designers can leverage its depth for high-end branding, while developers can implement these hex codes to evoke a sense of grandeur in digital interfaces, ensuring a consistent and elegant user experience across platforms.

Best used for

Luxury product branding and packaging
High-end event invitations and decor
Fashion and jewelry e-commerce sites
Interior design mood boards
Editorial layouts for premium magazines
Theatrical set design concepts

Suggested color roles

primary

#36013F - Ideal for dominant elements like main navigation, large background sections, or brand logos where deep richness is desired.

secondary

#6B2737 - Excellent for supporting headers, sub-sections, or call-to-action buttons to add warmth without overwhelming.

accent

#A74C4D - Use this vibrant, warm tone for interactive elements, hover states, or small decorative details that need to pop.

background

#D8A47F - A soft, inviting base color perfect for content areas, card backgrounds, or subtle page backdrops.

text

#B29958 - Best for decorative text or headings on dark backgrounds. For body text on #D8A47F, consider a dark charcoal or black for readability.

Accessibility notes

Ensure sufficient contrast when using #B29958 text on #D8A47F; it may require larger font sizes or bolder weights.
#36013F provides excellent contrast for light text (e.g., white or #D8A47F), making it suitable for primary text on dark themes.
Test text readability of #6B2737 on #D8A47F, aiming for WCAG AA compliance for body text.
Avoid placing #A74C4D text directly on #6B2737 as the contrast might be insufficient for accessibility.

Recommended combinations

Deep Elegance

Use #36013F as a dominant background, #D8A47F for content blocks, and #B29958 for highlights and decorative elements.

#36013F · #D8A47F · #B29958

Brocade Contrast

#6B2737 for primary elements, #A74C4D for accents, and #D8A47F for text or lighter backgrounds.

#6B2737 · #A74C4D · #D8A47F

Rich Accents

A lighter base with metallic gold accents and deep, grounding text or icons.

#D8A47F · #B29958 · #36013F

CSS variables

:root {
  --royal-jewel-brocade-1: #36013F;
  --royal-jewel-brocade-2: #6B2737;
  --royal-jewel-brocade-3: #A74C4D;
  --royal-jewel-brocade-4: #D8A47F;
  --royal-jewel-brocade-5: #B29958;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "royal-jewel-brocade": {
        1: "#36013F",
        2: "#6B2737",
        3: "#A74C4D",
        4: "#D8A47F",
        5: "#B29958",
      }
    }
  }
}

Hex values

Color 1#36013F

Color 2#6B2737

Color 3#A74C4D

Color 4#D8A47F

Color 5#B29958

Accessibility

Contrast checker

1.6:1Fail

3.1:1AA18

7.7:1AAA

6.2:1AA

1.6:1Fail

1.9:1Fail

4.8:1AA

3.9:1AA18

3.1:1AA18

1.9:1Fail

2.5:1Fail

2:1Fail

7.7:1AAA

4.8:1AA

2.5:1Fail

1.3:1Fail

6.2:1AA

3.9:1AA18

2:1Fail

1.3:1Fail

Similar palettes

More like Royal Jewel Brocade

View all dark

Byzantine Jewel

Gemstone Radiance Aura