This midnight to black to aqua linear 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.

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

13.93:1

WCAG AA friendly

Black text

5.68:1

WCAG AA friendly

Pre-rendered CSS output

.prismforge-gradient {
  background: linear-gradient(135deg, #00002f 0%, #030802 50%, #1cf0ff 100%);
  background: linear-gradient(135deg, #00002f 0%, #00012e 4.5%, #00022d 9.1%, #000628 13.6%, #000a21 18.2%, #000c17 22.7%, #000d0d 27.3%, #000c05 31.8%, #000a03 36.4%, #010902 40.9%, #030802 45.5%, #030802 50%, #040b03 54.5%, #071407 59.1%, #0e2513 63.6%, #163e28 68.2%, #1b6048 72.7%, #188671 77.3%, #0eaa9d 81.8%, #07c9c6 86.4%, #0fdfe6 90.9%, #19ecf9 95.5%, #1cf0ff 100%);
  background: linear-gradient(135deg in oklch, oklch(13.80% 0.0956 264.05) 0%, oklch(12.32% 0.0236 138.68) 50%, oklch(87.14% 0.1456 203.05) 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.