---
title: "Motion Blur — Framer component · Best of Framer"
description: "$12.00 · Framer component · by Rodrigo Calix · Effects. Auto & Static Blur Motion Graphic"
canonical: "https://framer.elliotli.dev/component/motion-blur"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/Motion Blur

# Motion Blur

Auto & Static Blur Motion Graphic

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

![Motion Blur preview image 1](https://framer.elliotli.dev/og/component/motion-blur/81d67ccd404fe4a2/1600x1200.jpg)

## Summary

Auto & Static Blur Motion Graphic

## Description

## What's included?

-   Remix Link with 4 demos ✅
    
-   Component URL ✅
    
-   Documentation ✅
    
-   License ✅
    
-   Customer Support ✅
    

## Would you prefer getting a bundle?

📦️ You can get my paid components including this one at a significantly lower price [following this link](https://contra.com/products/V3T33JrQ-schemetastic-framer-components-bundle)

![Custom Properties
](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-c3tbpoyh-qEslapT0AGlgydv0RrY8einluCnQAH)Custom Properties ![Blur Types
](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-c3tbpoyh-dieVKF6DoAvTK9F2SdeU1lGLd90qsW)Blur Types ![Documentation
](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-c3tbpoyh-dos6CJGxZG4YOY9WaB6WGkw0q7G1ur)Documentation

## Key Benefits

-   **Auto Motion Detection**Blur adapts intelligently to movement.
    
-   **Cinematic Blur Effect**Create smooth, high-quality motion trails that feel fluid.
    
-   **Full Creative Control**Fine-tune blur intensity, smoothing, samples, and scale to match your style.
    
-   **Real-Time Performance**The Auto blur uses WebGL for fast, responsive rendering—even with complex effects. In the case of Static blur, it uses 2d canvas context instead to avoid exhausting the number of WebGL contexts.
    

## Limitations

### Limited number of auto blur intances

The "Auto" blur uses WebGL for the blur effect, WebGL is very performant and great for effects like this one, but if you run many elements with a WebGL context (this is truth not just for this component), in some devices, canvases using it could start to crash and stop displaying its content. My personal recommendation is that you use at most 4-6 per page, and this number can vary depending on how many other WebGL components you are using.

### What about static blur instances?

This ones doesn't have the same limitations, they rely on 2d canvas context and you can use much more of these.

### Performance

If you run multiple Auto blur instances with large sample values, in some devices may not perform as fast as you would like. For better performance use a value between 10-18 samples in auto blur instances and limit the amount of components per page.

## Support

Feel free to reach me out for any help [https://schemetastic-support.framer.website/](https://schemetastic-support.framer.website/)

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

-   All · #6309

## Details

- **Author**: Rodrigo Calix
- **Price**: $12.00
- **Published**: 2026-05-30
- **Updated**: 2026-10-20
- **Added**: 2026-05-19
- **Categories**: Effects

## More like this

-   [Particle Image](/component/particle-image) — Jamik · $12 — Logos and photos as 3D points
-   [Ascii Portrait](/component/ascii-portrait) — The Black Sheep · Free — Photos that dissolve into ASCII
-   [Sandfall](/component/sandfall) — Cyedi Creative Studio · $5 — Your headline, buried in coloured
-   [Still Water](/component/still-water) — DariStudio · $9 — Water ripples over any photo