---
title: "Fisheye FX — Framer component · Best of Framer"
description: "$6.00 · Framer component · by Mikiko Niwa · Sections. Interactive WebGL fisheye for images"
canonical: "https://framer.elliotli.dev/component/fisheye-fx"
---

[Home](/)/[Components](/components)/[Sections](/components/category/sections)/Fisheye FX

# Fisheye FX

Interactive WebGL fisheye for images

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

![Fisheye FX preview image 1](https://framer.elliotli.dev/og/component/fisheye-fx/aae6ec1a2f7a7111/1600x1200.jpg)

## Summary

Interactive WebGL fisheye for images

## Description

**How to use**

-   Drop the component onto your canvas
    
-   Add your image in the panel
    
-   Tune Distortion, Lens size, and the effects to taste
    

**Image & framing**

-   Image — the photo you want to warp
    
-   Fit — Cover (fill the circle) or Contain (show the whole image)
    

**Lens & Distortion**

-   Distortion — strength of the fisheye bulge, from subtle wide-angle to extreme
    
-   Zoom — how far in or out the image sits inside the lens
    
-   Chromatic — amount of RGB color split along the edges
    
-   Lens mask — Circle (round lens) or Full (warp the entire frame)
    
-   Lens size — diameter of the circle
    
-   Edge soft — feather/softness of the circle's edge
    
-   Focal X / Focal Y — shift the image to frame your subject
    
-   Corner — corner radius (Full mode only)
    

**Style**

-   Background — color behind the circle (transparent by default)
    
-   Glass ring — show or hide the rim around the lens
    
-   Ring color / width — style the rim
    
-   Ring glow — add a soft glow to the rim
    

**Effects**

-   Grain / Grain amt — film-grain texture and its intensity
    
-   Scanlines / Scan amt — retro scanline / VHS overlay and its intensity
    

**Motion**

-   Cursor follow / Follow amt — image drifts with the pointer
    
-   Bulge follows / Bulge amt — the distortion center tracks the cursor
    
-   Auto float / Float speed — gentle idle movement and its speed
    

**Tips**

-   Looks best with a square-ish image and a centered subject
    
-   Transparent by default — add a Frame behind for any color, gradient, image, or video
    

**Compatibility**

-   Runs on WebGL — works across all modern browsers
    
-   Falls back to a small message (never a broken layout) where WebGL isn't supported
    
-   On touch devices, cursor effects pause; Auto float still runs
    

**Performance**

-   GPU fragment shader — light and smooth at any size
    
-   Pauses animation off screen and in background tabs
    

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

-   All · #7377

## Details

- **Author**: Mikiko Niwa
- **Price**: $6.00
- **Published**: 2026-06-06
- **Updated**: 2026-06-06
- **Added**: 2026-06-04
- **Categories**: Sections

## More like this

-   [Project Index](/component/project-index) — Bernardo Lickfold · Free — Editorial index: hover & scroll
-   [Face Parade](/component/face-parade) — RAjan · Free — Animated team profiles
-   [Staircase Cover Flow](/component/staircase-cover-flow) — Karim Saif · $7 — editorial-inspired image gallery
-   [In Their Words](/component/in-their-words) — Majed Monem · $9 — A wall of customer quotes