---
title: "Wave Distortion — Framer component · Best of Framer"
description: "$3.00 · Framer component · by Edi Priatama · Backgrounds. Best Interactive background"
canonical: "https://framer.elliotli.dev/component/wave-distortion"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/Wave Distortion

# Wave Distortion

Best Interactive background

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

![Wave Distortion preview image 1](https://framer.elliotli.dev/og/component/wave-distortion/c529bda77139739c/1600x1200.jpg)

## Summary

Best Interactive background

## Description

WaveDistortion is an interactive background component that renders a grid of dots. As the cursor moves across the screen, nearby dots are smoothly pushed away, creating a fluid wave-like distortion effect that responds in real time.

### Customize Options

**Dot Color** : Set the color of the animated dot grid.

**Spacing** : Control the distance between each dot in the grid.

**Radius** : Adjust the cursor's area of influence.

**Repel Force** : Control how strongly dots are pushed away by the cursor.

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

-   All · #3327

## Details

- **Author**: Edi Priatama
- **Price**: $3.00
- **Published**: 2026-07-28
- **Updated**: 2026-11-01
- **Added**: 2026-07-28
- **Categories**: Backgrounds

## More like this

-   [Pixel Flicker](/component/pixel-flicker) — Design Foundry · $10 — premium animated pixel background
-   [Fractal Glass Wave](/component/fractal-glass-wave) — Hienn Ng · $3 — Dynamic Fractal Glass Background
-   [Particle Flow Pro](/component/particle-flow-pro) — Interface Studio · $10 — Bring Your Background to Life
-   [Silk Gradient](/component/silk-gradient) — Kaisa A · Free — Silk Gradient Background