Back to palettes

Palette

Pearl Oyster Sheen

A delicate range of off-whites and grays, mirroring the subtle, lustrous sheen of an inner oyster shell.

neutralelegant5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#DCDCDC#E8E8E8#F3F3F3#A0A0A0#B8B8B8

Palette guide

How to use Pearl Oyster Sheen

Overview

The Pearl Oyster Sheen palette presents a delicate range of off-whites and grays, mirroring the subtle, lustrous sheen of an inner oyster shell. With soft tones like #F3F3F3, #E8E8E8, and the slightly deeper #A0A0A0, this collection is ideal for designs seeking understated elegance and a minimalist aesthetic. Designers and developers can leverage these harmonious hues to create clean user interfaces, refined branding, or serene print materials. The palette’s inherent softness provides a calming visual experience, while the gentle contrast between shades allows for sophisticated layering and depth without being overtly bold. It's perfect for conveying purity and quiet luxury.

Best used for

  • Minimalist website and app design
  • Art gallery and museum branding
  • Wedding stationery and event collateral
  • Sophisticated fashion and lifestyle brands
  • Interior design textiles and finishes
  • Clean, editorial layouts

Suggested color roles

primary

Use #DCDCDC as a soft, foundational base for main content blocks or larger areas, providing a sense of calm.

secondary

Employ #E8E8E8 for supporting elements, subtle dividers, or backgrounds of secondary sections, maintaining lightness.

accent

Apply #A0A0A0 for subtle definition, icons, or important headings, offering the strongest contrast within the palette.

background

Utilize #F3F3F3 as the primary background color for a pristine, ultra-clean canvas that maximizes visual space.

text

For body text, use #A0A0A0 or a slightly darker charcoal (not in palette, e.g., #444444) to ensure optimal legibility on light backgrounds.

Accessibility notes

  • High contrast is crucial for text; use #A0A0A0 for body text on #F3F3F3 or #E8E8E8 backgrounds to meet WCAG AA.
  • Avoid using #E8E8E8 or #F3F3F3 for small text, as readability will be severely compromised.
  • Ensure interactive elements have clear focus and hover states that are visually distinct.
  • Consider larger font sizes for headings or key information if using lighter gray text.

Recommended combinations

Pure Minimalism

Excellent for creating a clean, layered background effect or for sections requiring maximum luminosity and subtlety.

#F3F3F3 · #E8E8E8 · #DCDCDC

Subtle Definition

Ideal for establishing hierarchy in text, borders, or UI components where gentle yet clear separation is needed.

#DCDCDC · #B8B8B8 · #A0A0A0

Soft Contrast

Perfect for highlighting call-to-action buttons or important information against a very light background, ensuring readability.

#F3F3F3 · #B8B8B8 · #A0A0A0

CSS variables

:root {
  --pearl-oyster-sheen-1: #DCDCDC;
  --pearl-oyster-sheen-2: #E8E8E8;
  --pearl-oyster-sheen-3: #F3F3F3;
  --pearl-oyster-sheen-4: #A0A0A0;
  --pearl-oyster-sheen-5: #B8B8B8;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "pearl-oyster-sheen": {
        1: "#DCDCDC",
        2: "#E8E8E8",
        3: "#F3F3F3",
        4: "#A0A0A0",
        5: "#B8B8B8",
      }
    }
  }
}

Related searches

subtle grey paletteoff-white eleganceminimalist neutral colorsoyster shell colorsdelicate design scheme

Palette colors

Hex values

Color 1#DCDCDC
·
Color 2#E8E8E8
·
Color 3#F3F3F3
·
Color 4#A0A0A0
·
Color 5#B8B8B8
·

Accessibility

Contrast checker

1
2
3
4
5
1
1.1:1Fail
1.2:1Fail
1.9:1Fail
1.4:1Fail
2
1.1:1Fail
1.1:1Fail
2.1:1Fail
1.6:1Fail
3
1.2:1Fail
1.1:1Fail
2.4:1Fail
1.8:1Fail
4
1.9:1Fail
2.1:1Fail
2.4:1Fail
1.3:1Fail
5
1.4:1Fail
1.6:1Fail
1.8:1Fail
1.3:1Fail

Similar palettes

More like Pearl Oyster Sheen

View all neutral
Ancient Marble Sculpture
Oyster Pearl Luster
Porcelain Grace
Ancient Marble Ruins
Ancient Marble Veins
Antique Lace Veil