Back to palettes

Palette

Smoky Quartz Aura

Subtle and sophisticated greys and taupes embody the quiet strength and mysterious translucence of smoky quartz.

neutralelegant5 colors
More neutral palettes

Preview

See it in context.

Interface

New

Ready when you are.

A quick look at how Smoky Quartz Aura 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 Smoky Quartz Aura.

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

Data visualization

#A8A8A8#6B6B6B#424242#D0CDC1#8A8278

Palette guide

How to use Smoky Quartz Aura

Overview

The Smoky Quartz Aura palette offers a sophisticated blend of subtle greys and warm taupes, evoking a sense of quiet strength and natural elegance. This neutral collection is perfect for designs aiming for understated luxury and timeless appeal. Featuring a light grey #A8A8A8, a versatile medium grey #6B6B6B, and a deep charcoal #424242, it provides a solid foundation. Complementing these are the soft, near-white #D0CDC1 and a grounding taupe #8A8278. Designers can leverage this palette for serene interfaces, elegant branding, or sophisticated editorial layouts. Developers will find these hex codes easy to implement for creating harmonious and accessible digital experiences, ensuring a cohesive visual language that feels both modern and classic.

Best used for

  • High-end fashion and lifestyle branding
  • Minimalist website design and UI/UX
  • Interior design mood boards and presentations
  • Editorial layouts for luxury magazines
  • Corporate identity for professional services
  • Packaging for premium natural products

Suggested color roles

primary

Use #6B6B6B as a versatile primary color for main sections or prominent UI elements, offering a balanced and sophisticated anchor.

secondary

Apply #A8A8A8 for supporting elements, secondary buttons, or subtle gradients, maintaining a light and airy feel.

accent

Employ #424242 sparingly for impactful accents like call-to-action buttons or critical icons, providing strong contrast and depth.

background

Utilize #D0CDC1 as a soft, warm background, ideal for creating an inviting and comfortable user experience.

text

For body text on light backgrounds like #D0CDC1, use #424242 for optimal readability. For text over #A8A8A8 or #6B6B6B, a true black or very dark charcoal provides necessary contrast.

Accessibility notes

  • Ensure #424242 text on #D0CDC1 background meets WCAG AA standards for small text (4.5:1) and AAA for large text (7:1).
  • Avoid using #A8A8A8 or #6B6B6B for primary text on #D0CDC1 as contrast may be insufficient for readability.
  • Use a robust color contrast checker when pairing any two colors from this palette, especially for interactive elements.
  • For interactive elements, ensure sufficient visual cues beyond color, as some combinations might have low contrast for users with visual impairments.

Recommended combinations

Subtle Foundation

Ideal for clean website backgrounds, secondary navigation, and subtle UI elements where elegance is key.

#D0CDC1 · #A8A8A8 · #6B6B6B

Deep Contrast

Effective for high-contrast text and interactive elements on a light background, paired with a grounding accent.

#D0CDC1 · #424242 · #8A8278

Warm Neutral

Creates a warm, inviting feel for branding, editorial content, or product showcases with a natural aesthetic.

#8A8278 · #A8A8A8 · #6B6B6B

CSS variables

:root {
  --smoky-quartz-aura-2-1: #A8A8A8;
  --smoky-quartz-aura-2-2: #6B6B6B;
  --smoky-quartz-aura-2-3: #424242;
  --smoky-quartz-aura-2-4: #D0CDC1;
  --smoky-quartz-aura-2-5: #8A8278;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "smoky-quartz-aura-2": {
        1: "#A8A8A8",
        2: "#6B6B6B",
        3: "#424242",
        4: "#D0CDC1",
        5: "#8A8278",
      }
    }
  }
}

Related searches

neutral grey brown paletteelegant stone color schemesubtle mineral tonessophisticated taupe greyquiet luxury color palette

Palette colors

Hex values

Color 1#A8A8A8
·
Color 2#6B6B6B
·
Color 3#424242
·
Color 4#D0CDC1
·
Color 5#8A8278
·

Accessibility

Contrast checker

1
2
3
4
5
1
2.2:1Fail
4.2:1AA18
1.5:1Fail
1.6:1Fail
2
2.2:1Fail
1.9:1Fail
3.3:1AA18
1.4:1Fail
3
4.2:1AA18
1.9:1Fail
6.3:1AA
2.7:1Fail
4
1.5:1Fail
3.3:1AA18
6.3:1AA
2.4:1Fail
5
1.6:1Fail
1.4:1Fail
2.7:1Fail
2.4:1Fail

Similar palettes

More like Smoky Quartz Aura

View all neutral