component
Pixel Displace
By Ludovic Losco
Details
- Ludovic LoscoAuthor
- componentType
- $10.00Price
- 2025-08-26Published
- 2026-04-27Updated
- 2025-08-18Added
- EffectsCategories
Summary
Interactive pixel displacement for media
Description
Transform static images and videos into playful, interactive visuals. PixelDisplace uses a custom WebGL shader to create a pixelated push/pull displacement effect that reacts to cursor movement. Perfect for portfolios, hero sections, and experimental layouts, this effect adds a tactile, modern feel without compromising performance. Key Features Image & Video Support → Works with standard images (incl. SVG) and uploaded video files. Push or Pull Modes → Choose whether pixels repel or attract along the cursor path. Pixel Grid Control → Adjust block size from subtle texture to bold retro pixels. Strength & Spread → Fine-tune how far and wide the displacement reaches. Smooth Motion → Separate controls for hover speed and follow speed, plus soft fade on exit. HiDPI Ready → Crisp results across all devices. Responsive Media Handling → Maintains correct aspect ratio when width or height is set to Fit. Bring your visuals to life with an interactive shader that feels natural and design-forward. Try it here: https://minimum.supply/pixel-displace
Introduction
Interactive pixel displacement for media
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #2033