PRISM

PRISM is a pointer-reactive image shader for Framer built for hero sections, portfolio showcases, product reveals, and any layout that needs a moment of visual surprise.

Add real-time shader effects to any image with a single cursor interaction. PRISM is a pointer-reactive image shader for Framer built for hero sections, portfolio showcases, product reveals, and any layout that needs a moment of visual surprise. One component, four completely different shader effects — drop in your image, pick Ripple, Liquid, Chromatic, or Pixel, and watch it react to your cursor in real time. Key Features: 4-in-1 component: Ripple, Liquid, Chromatic, and Pixel effects in a single install Real-time cursor reactivity with smooth hover transitions Full control over intensity, radius, speed, and noise Separate hover strength control for subtle or dramatic reactions Chromatic aberration and pixel size exposed as individual props Adjustable border radius and background color Graceful fallback for static rendering and non-WebGL environments Controls: Effect switches between Ripple, Liquid, Chromatic, and Pixel Intensity controls how strong the visual distortion feels Radius sets how far the effect spreads from the cursor Speed adjusts how quickly the effect moves or reacts Hover controls how much the effect appears on hover Noise adds texture and organic irregularity to the motion Chromatic and Pixel Size are effect-specific fine-tuning props Best For: Hero sections with interactive image moments Portfolio and creative agency layouts Product photography reveals Editorial and fashion landing pages Any section where a static image needs more life

4-in-1 image shader effect (hover)