Palette

Pearl Sheen Elegance

A sophisticated grayscale palette with a soft, iridescent glow, like polished pearls and fine silver.

NeutralElegant5 colors

More Neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Pearl Sheen Elegance 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 Pearl Sheen Elegance.

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

Data visualization

#E0E0E0#BDBDBD#9E9E9E#616161#CFD8DC

Palette guide

How to use Pearl Sheen Elegance

Overview

The Pearl Sheen Elegance palette offers a sophisticated grayscale range with a soft, iridescent glow, reminiscent of polished pearls and fine silver. Featuring tones from the luminous #E0E0E0 to the grounding #616161, this collection is perfect for designs demanding a refined and minimalist aesthetic. Designers and developers can utilize these versatile grays to create professional user interfaces, corporate branding, or elegant editorial layouts. The subtle variation between shades, including the cool hint of #CFD8DC, allows for depth and visual interest while maintaining a cohesive and sophisticated feel. It's an excellent choice for projects requiring a clean, modern, and understated luxurious presence.

Best used for

Corporate and professional branding
Tech and software user interfaces
Minimalist photography portfolios
Luxury product packaging
Editorial and print design
Architectural and interior design visualizations

Suggested color roles

primary

Use #BDBDBD as a balanced, elegant base for main content areas or larger sections, providing a sophisticated foundation.

secondary

Employ #E0E0E0 for lighter sections, subheadings, or as a background for secondary elements, adding brightness.

accent

Apply #616161 for strong contrast, key interactive elements, or important textual information, ensuring clarity.

background

Utilize #E0E0E0 as a clean, professional background color, or #CFD8DC for a slightly cooler, nuanced base.

text

For body text, #616161 or a near-black is ideal to ensure optimal readability against the lighter backgrounds.

Accessibility notes

Ensure sufficient contrast between text and background, especially when using lighter grays on #E0E0E0.
Reserve #616161 for main body text and critical information to meet WCAG AA contrast guidelines.
Check contrast ratios for interactive elements like buttons and links to ensure they are discernible.
The subtle cool tone of #CFD8DC might require specific testing for contrast with other grays.

Recommended combinations

Classic Grayscale

Ideal for creating a smooth, tonal gradient in backgrounds, headers, or for subtle depth in visual elements.

#E0E0E0 · #BDBDBD · #9E9E9E

Deep Contrast

Effective for establishing strong hierarchy, such as dark text on a lighter panel, or for defining key UI components.

#616161 · #9E9E9E · #BDBDBD

Subtle Cool

Perfect for introducing a slight cool undertone to backgrounds or for differentiating sections with a gentle hue shift.

#CFD8DC · #E0E0E0 · #BDBDBD

CSS variables

:root {
  --pearl-sheen-elegance-1: #E0E0E0;
  --pearl-sheen-elegance-2: #BDBDBD;
  --pearl-sheen-elegance-3: #9E9E9E;
  --pearl-sheen-elegance-4: #616161;
  --pearl-sheen-elegance-5: #CFD8DC;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pearl-sheen-elegance": {
        1: "#E0E0E0",
        2: "#BDBDBD",
        3: "#9E9E9E",
        4: "#616161",
        5: "#CFD8DC",
      }
    }
  }
}

Hex values

Color 1#E0E0E0

Color 2#BDBDBD

Color 3#9E9E9E

Color 4#616161

Color 5#CFD8DC

Accessibility

Contrast checker

1.4:1Fail

2:1Fail

4.7:1AA

1.1:1Fail

1.4:1Fail

3.3:1AA18

1.3:1Fail

2:1Fail

1.4:1Fail

2.3:1Fail

1.9:1Fail

4.7:1AA

3.3:1AA18

2.3:1Fail

4.3:1AA18

1.1:1Fail

1.3:1Fail

1.9:1Fail

4.3:1AA18

Similar palettes

More like Pearl Sheen Elegance

Pearl Sheen Elegance

See it in context.

Ready when you are.

Built with Pearl Sheen Elegance.

How to use Pearl Sheen Elegance

Overview

Best used for

Suggested color roles

Accessibility notes

Recommended combinations

Classic Grayscale

Deep Contrast

Subtle Cool

CSS variables

Tailwind config

Related searches

Hex values

Contrast checker

More like Pearl Sheen Elegance