This midnight to orange to pink conic 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

7.45:1

WCAG AA friendly

Black text

5.24:1

WCAG AA friendly

Pre-rendered CSS output

.prismforge-gradient {
  background: conic-gradient(from 0deg at 50% 50%, #22184a 0%, #ff8b19 50%, #f13080 100%);
  background: conic-gradient(from 0deg at 50% 50%, #22184a 0%, #25194d 4.5%, #301c54 9.1%, #452260 13.6%, #63296b 18.2%, #8a326f 22.7%, #b33f68 27.3%, #d45358 31.8%, #eb6944 36.4%, #f77b30 40.9%, #fd8720 45.5%, #ff8b19 50%, #ff8918 54.5%, #ff8417 59.1%, #ff7a1a 63.6%, #ff6d26 68.2%, #ff5d39 72.7%, #ff4d4e 77.3%, #ff4060 81.8%, #fb386f 86.4%, #f63379 90.9%, #f2317e 95.5%, #f13080 100%);
  background: conic-gradient(from 0deg at 50% 50% in oklch, oklch(25.44% 0.0887 287.55) 0%, oklch(74.95% 0.1765 56.42) 50%, oklch(63.73% 0.2303 2.15) 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.