component
VFXImagePixelate
By FramerHub.io
Details
- FramerHub.io Author
- componentType
- $9.00Price
- 2026-04-07Published
- 2026-04-07Updated
- 2026-01-19Added
- EffectsCategories
Summary
VFX Pixelate WebGL Transition
Description
Overview A retro-inspired pixelation effect using Three.js WebGL shaders. Creates nostalgic 8-bit style reveals with smooth, high-performance animations. Features Smooth Transitions A fluid transition from pixelated to clear (or vice versa) using spring physics. Retro Aesthetic Adds a digital, 8-bit feel to your image reveals. Performance Optimized Uses efficient shaders to ensure 60fps animations. Fully Responsive Adapts seamlessly to any container or screen size. Use Cases Product Reveals — Start pixelated and reveal the sharp product image on hover. Gallery Transitions — Add a unique texture to your grid layouts. Retro Themes — Perfect for 8-bit or brutalist design aesthetics. Feature Highlights — Draw attention to key visuals as the user interacts. Properties Image : Responsive image source Image Fit : Fill, Cover, or Contain Strength : Effect intensity (0-2) Pixel Size : Size of pixels (1-100) Trigger : Always or On Hover Invert Hover : Flip hover logic (visible when Trigger is Hover) Customization Image Settings Image: Choose your image source Image Fit: Select Fill, Cover, or Contain Effect Settings Strength: Effect intensity (0-2) Pixel Size: Size of pixels (1-100) Trigger Options Trigger: Choose "Always" or "On Hover" Invert: Flip the hover logic License Single Use License — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client. Refund Policy Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns! Version 1.0.0
Introduction
VFX Pixelate WebGL Transition
Rank history
Daily rank per list, from the first snapshot — lower is better.
- All · #6773