This midnight to purple to cyan 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

9.01:1

WCAG AA friendly

Black text

4.87:1

WCAG AA friendly

Pre-rendered CSS output

.prismforge-gradient {
  background: linear-gradient(135deg, #000744 0%, #8f22dd 50%, #39c1f0 100%);
  background: linear-gradient(135deg, #000744 0%, #010747 4.5%, #040950 9.1%, #0d0a60 13.6%, #1c0c76 18.2%, #300f90 22.7%, #4712a9 27.3%, #5f17bd 31.8%, #731ccc 36.4%, #831fd6 40.9%, #8c21db 45.5%, #8f22dd 50%, #8e27e0 54.5%, #8a33e7 59.1%, #8146f3 63.6%, #735dff 68.2%, #5d76ff 72.7%, #418eff 77.3%, #23a3ff 81.8%, #1ab1fc 86.4%, #29bbf5 90.9%, #35c0f1 95.5%, #39c1f0 100%);
  background: linear-gradient(135deg in oklch, oklch(18.88% 0.1117 264.08) 0%, oklch(52.94% 0.2533 304.76) 50%, oklch(75.93% 0.1305 226.21) 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.