Granite Shaft Study

The soft grip of graphite and stone, where deep shadows meet quiet light across a neutral expanse.

Colors

~Ruined Smores#0D0E12
~Black#000000
~In the Dark#3A3D41
~Nocturnal#7A7E84
~Weathered Stone#C3C7CB

Psychology

The achromatic progression from near-black to light gray creates high visual contrast while maintaining a unified, monochromatic harmony that feels contemplative rather than harsh. Low chromatic intensity across all five colors signals restraint and calm, preventing visual fatigue despite the wide tonal range. This combination leverages the principle that neutral palettes with strong contrast command attention without emotional agitation, making viewers feel grounded rather than stimulated.

Usage

Apply this palette to typographic-heavy editorials, minimal product photography, and architecture branding where tonal depth matters more than color. The high contrast between darkest and lightest values excels in institutional design, tech interfaces, and gallery catalogs that demand visual clarity and sophistication. Use for luxury packaging, minimal fashion lookbooks, and print collateral targeting audiences who value restraint and craftsmanship.

Code

CSS Gradient
/* CSS gradient approximation of mesh gradient */
/* Note: This is a linear approximation. For the full animated mesh effect, use the React/JS export. */
background: linear-gradient(
    90deg,
    #0d0e12 0%,
    #000000 25%,
    #3a3d41 50%,
    #7a7e84 75%,
    #c3c7cb 100%
  );
Tailwind v4
/* app.css — Tailwind v4 */
@theme {
  --color-gradient-1: #0d0e12;
  --color-gradient-2: #000000;
  --color-gradient-3: #3a3d41;
  --color-gradient-4: #7a7e84;
  --color-gradient-5: #c3c7cb;
}

/* Usage: bg-gradient-1, text-gradient-2, etc. */
CSS Variables
--color-1: #0d0e12;
--color-2: #000000;
--color-3: #3a3d41;
--color-4: #7a7e84;
--color-5: #c3c7cb;
Hex values
#0d0e12, #000000, #3a3d41, #7a7e84, #c3c7cb

Building something? Get this palette via the REST API.

History

Granite Shaft Study — Color Palette | InstantGradient