Palette

Smoky Quartz Elegance

A sophisticated gradient of deep to light greys, inspired by the translucent beauty of smoky quartz.

monochromeelegant5 colors

More monochrome palettes

Preview

See it in context.

Interface

New

Ready when you are.

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

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

Data visualization

#1a1a1a#4a4a4a#7b7b7b#adadad#d3d3d3

Palette guide

How to use Smoky Quartz Elegance

Overview

The Smoky Quartz Elegance palette presents a striking monochrome gradient, delivering a powerful yet refined aesthetic. Ranging from an almost black #1a1a1a to a soft, translucent light grey #d3d3d3, this collection captures the deep, mysterious quality of smoky quartz. Intermediate shades like #4a4a4a, #7b7b7b, and #adadad provide a full spectrum for creating sophisticated visual depth and hierarchy. This palette is ideal for projects demanding a strong, elegant, and minimalist presence, such as high-end digital platforms, luxury brand identity, or architectural designs. Designers and developers will find these hex codes perfect for crafting clean, impactful, and timeless user experiences.

Best used for

Dark mode UI/UX design
Luxury brand identity
Modern art gallery websites
High-contrast editorial layouts
Tech and software interfaces
Architectural and interior design concepts

Suggested color roles

primary

Utilize #4a4a4a as a robust primary color for main content areas or background panels, offering a sophisticated dark base.

secondary

Employ #7b7b7b for secondary information, subheadings, or subtle borders, providing clear distinction without harshness.

accent

Use #1a1a1a for strong accents, critical call-to-actions, or bold typography, maximizing visual impact.

background

Apply #d3d3d3 as a clean, bright background for content sections needing high readability, or #4a4a4a for a moody, dark theme.

text

For primary body text on light backgrounds like #d3d3d3, #1a1a1a ensures maximum readability. On dark backgrounds such as #4a4a4a, use #d3d3d3.

Accessibility notes

Ensure #1a1a1a text on #d3d3d3 background meets WCAG AAA contrast standards for all text sizes.
Verify that #d3d3d3 text on #4a4a4a background also meets WCAG AA standards.
Be cautious with #adadad text on #7b7b7b as contrast might be insufficient for readability.
Use clear focus states and visual indicators for interactive elements, not relying solely on subtle color changes.

Recommended combinations

Dark Foundation

Creates a deep, sophisticated base for dark mode interfaces or moody branding, offering excellent contrast.

#4A4A4A · #1A1A1A · #7B7B7B

Light Content

Ideal for high-readability content blocks, ensuring strong text contrast on a clean, light canvas.

#D3D3D3 · #1A1A1A · #4A4A4A

Gradient Depth

Perfect for creating subtle gradients or layered elements, adding dimension to UI components or backgrounds.

#7B7B7B · #ADADAD · #D3D3D3

CSS variables

:root {
  --smoky-quartz-elegance-3-1: #1a1a1a;
  --smoky-quartz-elegance-3-2: #4a4a4a;
  --smoky-quartz-elegance-3-3: #7b7b7b;
  --smoky-quartz-elegance-3-4: #adadad;
  --smoky-quartz-elegance-3-5: #d3d3d3;
}

Tailwind config

theme: {
  extend: {
    colors: {
      "smoky-quartz-elegance-3": {
        1: "#1a1a1a",
        2: "#4a4a4a",
        3: "#7b7b7b",
        4: "#adadad",
        5: "#d3d3d3",
      }
    }
  }
}

Hex values

Color 1#1a1a1a

Color 2#4a4a4a

Color 3#7b7b7b

Color 4#adadad

Color 5#d3d3d3

Accessibility

Contrast checker

2:1Fail

4.1:1AA18

7.8:1AAA

11.6:1AAA

2:1Fail

2.1:1Fail

3.9:1AA18

5.9:1AA

4.1:1AA18

2.1:1Fail

1.9:1Fail

2.8:1Fail

7.8:1AAA

3.9:1AA18

1.9:1Fail

1.5:1Fail

11.6:1AAA

5.9:1AA

2.8:1Fail

1.5:1Fail

Similar palettes

More like Smoky Quartz Elegance

View all monochrome

Gothic Library Ink

Sculpted Marble Elegance

Ancient Marble Column

Ancient Marble Statue

Elegant Onyx Chess

Gilded Frame Accent