---
title: "PRISM — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Antariksh \"Ryan\" Borgohain · Effects. PRISM is a pointer-reactive image shader for Framer built for hero sections, portfolio showcases, product reveals, and any…"
canonical: "https://framer.elliotli.dev/component/prism"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/PRISM

# PRISM

4-in-1 image shader effect (hover)

[View on Framer](https://framer.com/marketplace/components/prism/?via=elliot-li)

![PRISM preview image 1](https://framer.elliotli.dev/og/component/prism/1cb4e60c88b87a30/1600x1200.jpg)

## Summary

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.

## Description

## 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
    

## Rank history [How rankings work →](/terms#rankings)

-   All · #2473

## Details

- **Author**: Antariksh "Ryan" Borgohain
- **Price**: $5.00
- **Published**: 2026-04-16
- **Updated**: 2026-04-16
- **Added**: 2026-04-11
- **Categories**: Effects

## More like this

-   [Liquid Glass Loupe](/component/liquid-glass-loupe) — Aisol Studio · $12 — Liquid glass lens over content
-   [Sticky Scenes](/component/sticky-scenes) — Sofía Martín · $5 — Scroll-driven stories with sticky
-   [Studio ASCII Reveal](/component/studio-ascii-reveal) — Tanmay Kaper · $12 — Your portrait, redrawn in ASCII
-   [Kinetic Sprout](/component/kinetic-sprout) — Buster Studios · $19 — A headline that grows