Media Distort Lens
A surreal WebGL lens blending inverted reveal with grid distortion. Fully customizable, GPU-accelerated, and designed for smooth, immersive interaction.
Make it with Workshop
Build your own component with AI
Distort Lens — Surreal, Immersive, Cinematic
Invert. Distort. Reveal. — A WebGL-powered hybrid effect that fuses the surreal inverted-lens reveal with dynamic grid-based distortion, transforming static visuals into mesmerizing interactive experiences.
A lightweight yet powerful component for both images and videos. Built with WebGL, it introduces an organic inverted-color mask that follows your cursor, layered with responsive grid distortion that ripples and warps with cinematic depth. The result: media that feels alive, tactile, and unforgettable.
Why it works for your project
✨ Double impact — surreal inverted lens combined with responsive grid distortion.✨ Immersive interaction — every hover feels cinematic, alive, and unpredictable.✨ Modern aesthetic — blends glitch-inspired energy with smooth organic motion.✨ Seamless integration — fully adjustable, lightweight, and GPU-accelerated.
Feature Highlights
🎥 Image & Video support — apply seamlessly to both static and moving media.⭕ Dynamic lens radius — adjustable reveal area with smooth easing.#️⃣ Grid customization — control grid density, distortion strength, and relaxation.💨 Turbulent edges — lens edge ripples with psychedelic, organic distortion.⚡ Smooth motion — lerp factor ensures fluid tracking of cursor and distortion.🎨 Custom backgrounds — define fallback or loading states with your own color.🖥️ GPU-accelerated — ultra-smooth performance across devices and browsers.
Refund Policy
Try it risk-free: 7-day money-back guarantee if you’re not fully satisfied.
Support
Need help or have questions? Reach out anytime at
Minimal in setup, maximal in impact — Distort Lens merges the surreal with the structured, turning ordinary media into immersive, interactive artworks with a clean, efficient workflow.
