---
title: "Wavy Lines — Framer component · Best of Framer"
description: "$10.00 · Framer component · by Lauri Lännenmäki · Effects. Pro tip Set something on top of the wavy lines and play with blend modes to create cool effects."
canonical: "https://framer.elliotli.dev/component/wavy-lines"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/Wavy Lines

# Wavy Lines

Interactive waves

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

![Wavy Lines preview image 1](https://framer.elliotli.dev/og/component/wavy-lines/3c9a00244ebdf9c8/1600x1200.jpg)

## Summary

Pro tip Set something on top of the wavy lines and play with blend modes to create cool effects.

## Description

## About

Interactive animated wave grid component with fluid motion and mouse interaction effects. Creates dynamic flowing lines that respond to cursor movement with physics-based animations.

**Live demo:** [https://loving-population-943373.framer.app/demo](https://loving-population-943373.framer.app/demo)

![](https://y4pdgnepgswqffpt.public.blob.vercel-storage.com/components/description-image-4o88lddd-jTn4OO5LelbEwNKRdq2JZtvsBZydK9)

## Features

-   Choose between vertical, horizontal or both lines
    
-   Animated wave grid with Perlin noise-based movement
    
-   Interactive mouse/touch effects with radial displacement
    
-   Customizable wave speeds (horizontal and vertical)
    
-   Adjustable wave amplitudes for different motion intensities
    
-   Configurable grid spacing (X and Y gaps)
    
-   Physics controls (friction, tension, max displacement)
    
-   Customizable line and background colors
    
-   Smooth spring-based cursor interaction damping
    
-   Responsive canvas that fills container dimensions
    

The component creates a mesmerizing animated background perfect for modern web interfaces, with natural-feeling wave motion that users can interact with by moving their cursor across the surface.

## Pro tip

Set something on top of the wavy lines and play with blend modes to create cool effects.

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

-   All · #9874

## Details

- **Author**: Lauri Lännenmäki
- **Price**: $10.00
- **Published**: 2025-09-05
- **Updated**: 2026-04-16
- **Added**: 2025-09-05
- **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