This midnight to charcoal to midnight radial gradient is an editable CSS color system generated with OKLCH-aware perceptual interpolation, multi-stop fallback compilation, and Tailwind CSS utility export. It preserves chroma during transitions, reducing muddy gray midpoints while giving developers production-ready CSS and designers precise visual control.

SEO gradient page

midnight to charcoal to midnight radial CSS gradient

Edit this gradient in the studio, copy production CSS, compare accessibility, and explore related color combinations generated from the same seed colors.

#151028#352700#141b3c

Gradient guide

How to use this midnight to charcoal to midnight gradient

This radial gradient can be used as a hero background, dashboard card treatment, app shell backdrop, social visual, or landing page accent. The color sequence is parsed directly from the URL, which means the page can be shared, indexed, and revisited.

The export system creates a standard CSS fallback, a perceptual multi-stop fallback, and a modern OKLCH declaration where appropriate. That makes the output useful for production interfaces, not just screenshots or static inspiration boards.

Use the related-gradient matrix below to explore adjacent hues, lightness shifts, and route variations. Each link is generated deterministically so search crawlers and users always see stable, crawlable internal links.

Interactive editor

Edit this gradient

Physics Preview Workspace

Perceptual CSS gradients without muddy midpoints.

Build layered linear, radial, conic, and mesh gradients using OKLCH, LAB, HCL, easing curves, blend modes, and fallback compilers.

White text

16.61:1

WCAG AA friendly

Black text

1.28:1

Needs overlay

Pre-rendered CSS output

.prismforge-gradient {
  background: radial-gradient(circle at 50% 45%, #151028 0%, #352700 50%, #141b3c 100%);
  background: radial-gradient(circle at 50% 45%, #151028 0%, #161028 4.5%, #1a1029 9.1%, #210f28 13.6%, #290f25 18.2%, #320f1d 22.7%, #381213 27.3%, #3b1807 31.8%, #3a1e01 36.4%, #372300 40.9%, #362600 45.5%, #352700 50%, #362600 54.5%, #392400 59.1%, #3d1f00 63.6%, #41180a 68.2%, #40131a 72.7%, #3a122a 77.3%, #301435 81.8%, #25173b 86.4%, #1c193c 90.9%, #161b3c 95.5%, #141b3c 100%);
  background: radial-gradient(circle at 50% 45% in oklch, oklch(19.38% 0.0472 290.91) 0%, oklch(28.13% 0.0575 87.92) 50%, oklch(23.60% 0.0637 271.71) 100%);
  background-blend-mode: normal;
}

Full-width inspiration gallery

120 mathematically tuned gradient collections.

Each preset links to an indexable dynamic route with deterministic related gradients, metadata, crawlable anchors, and editable OKLCH controls.