Back to palettes

Palette

Art Deco Opal

A sophisticated blend of pearlescent grays and soft, shimmering pastels reminiscent of Art Deco opulence.

pastelelegant5 colors
More pastel palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Art Deco Opal 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 Art Deco Opal.

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

Data visualization

#A9A9A9#DCDCDC#E0FFFF#ADD8E6#DDA0DD

Palette guide

How to use Art Deco Opal

Overview

The "Art Deco Opal" palette offers a sophisticated blend of pearlescent grays and soft, shimmering pastels, reminiscent of Art Deco opulence and the ethereal glow of opals. This collection is ideal for designers and developers seeking to create designs that convey elegance, delicate luxury, and a soft, ethereal charm. The light grays, #A9A9A9 and #DCDCDC, provide a refined, neutral base, while the icy blues #E0FFFF and #ADD8E6, and the soft mauve #DDA0DD, introduce gentle, luxurious color. This palette is perfect for high-end beauty brands, wedding stationery, or digital interfaces that require a light, airy, and sophisticated touch.

Best used for

  • Luxury cosmetics branding
  • Wedding invitations and event decor
  • High-end jewelry display (digital or print)
  • Baby and children's luxury product design
  • Spa and wellness websites
  • Feminine fashion editorial

Suggested color roles

primary

Use #ADD8E6, a gentle, light blue, as a soothing and elegant primary color for main content backgrounds or large sections.

secondary

Apply #DDA0DD, a soft, delicate mauve, for secondary headings, subtle patterns, or accentuating feminine designs.

accent

Employ #A9A9A9, a sophisticated medium gray, for delicate borders, small icons, or subtle typography without overpowering pastels.

background

Select #E0FFFF, a very light, almost white aqua, as an airy, expansive, and clean canvas, making other colors appear luminous.

text

For text on #E0FFFF or #DCDCDC, use #A9A9A9 for a soft look or a darker gray (e.g., #696969) for improved readability.

Accessibility notes

  • Ensure #A9A9A9 text on #E0FFFF background meets WCAG AA contrast for body text; consider a darker gray for smaller text.
  • Avoid using #DCDCDC text on #ADD8E6, as the contrast will likely be too low.
  • The pastel colors like #E0FFFF and #ADD8E6 will require dark text (e.g., #A9A9A9 or black) for readability.
  • For critical UI elements, consider using #A9A9A9 as a darker accent against #E0FFFF.

Recommended combinations

Pearlescent Glow

Excellent for a delicate header or background, with the blue and mauve for gentle highlights.

#E0FFFF · #ADD8E6 · #DDA0DD

Soft Sophistication

Creates elegant content cards, using the medium gray for text and mauve for subtle accents.

#DCDCDC · #A9A9A9 · #DDA0DD

Ethereal Blend

Ideal for a serene UI, with the light blue as a primary background and grey for functional elements.

#ADD8E6 · #E0FFFF · #A9A9A9

CSS variables

:root {
  --art-deco-opal-2-1: #A9A9A9;
  --art-deco-opal-2-2: #DCDCDC;
  --art-deco-opal-2-3: #E0FFFF;
  --art-deco-opal-2-4: #ADD8E6;
  --art-deco-opal-2-5: #DDA0DD;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "art-deco-opal-2": {
        1: "#A9A9A9",
        2: "#DCDCDC",
        3: "#E0FFFF",
        4: "#ADD8E6",
        5: "#DDA0DD",
      }
    }
  }
}

Related searches

art deco pastel paletteopal inspired colorssilver and pastel schemeglamorous light colorselegant feminine design

Palette colors

Hex values

Color 1#A9A9A9
·
Color 2#DCDCDC
·
Color 3#E0FFFF
·
Color 4#ADD8E6
·
Color 5#DDA0DD
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.7:1Fail
2.2:1Fail
1.5:1Fail
1.1:1Fail
2
1.7:1Fail
1.3:1Fail
1.1:1Fail
1.5:1Fail
3
2.2:1Fail
1.3:1Fail
1.4:1Fail
2:1Fail
4
1.5:1Fail
1.1:1Fail
1.4:1Fail
1.4:1Fail
5
1.1:1Fail
1.5:1Fail
2:1Fail
1.4:1Fail

Similar palettes

More like Art Deco Opal

View all pastel