---
title: "Ambient Shaders — Framer component · Best of Framer"
description: "$5.00 · Framer component · by Muhmad Hmdo · Backgrounds. Ambient Shaders brings five handcrafted WebGL backgrounds to your Framer site each one reacts to your visitors' cursor and clicks…"
canonical: "https://framer.elliotli.dev/component/ambient-shaders"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/Ambient Shaders

# Ambient Shaders

Five interactive shader background

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

![Ambient Shaders preview image 1](https://framer.elliotli.dev/og/component/ambient-shaders/a7713303a25a677f/1600x1200.jpg)

## Summary

Ambient Shaders brings five handcrafted WebGL backgrounds to your Framer site each one reacts to your visitors' cursor and clicks in real time.

## Description

**Ambient Shaders brings five handcrafted WebGL backgrounds to your Framer site**

each one reacts to your visitors' cursor and clicks in real time.

Drop it on any frame as a background, hero, or full-page wallpaper. Every

parameter is exposed in the property panel: pick a shader, dial in speed,

intensity, and scale, choose a preset palette, or switch to Custom Colors

and set your own three-color gradient.

Runs at 60fps on modern devices, scales down gracefully via the Quality

control, and respects your layout — use it fixed, fluid, or inside any

container.

INCLUDED SHADERS

-   Mercury: liquid metal surface that ripples under the cursor
    
-   Plasma: warping energy field, click sends a shockwave
    
-   Cells: living voronoi tissue that leans toward the cursor
    
-   Aurora: drifting light ribbons steered by cursor wind
    
-   Warp: hyperspace tunnel that tracks the cursor
    

FEATURES

-   5 WebGL shaders, 20 curated palettes
    
-   Custom 3-color palette mode
    
-   Cursor & click interaction (toggleable)
    
-   Speed / Intensity / Scale controls
    
-   Quality slider (DPR cap) for performance tuning
    
-   Optional credit badge with link
    
-   Touch-friendly, responsive, zero dependencies
    

PERFORMANCE

_Refund Policy: All sales are final. No refunds._

**Free email support:**[framer@muhmad.me](mailto:framer@muhmad.me)

**More Components:**[sbarah.com](https://sbarah.com)

**Thanks >**

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

-   All · #7752

## Details

- **Author**: Muhmad Hmdo
- **Price**: $5.00
- **Published**: 2026-05-04
- **Updated**: 2026-10-19
- **Added**: 2026-04-17
- **Categories**: Backgrounds

## More like this

-   [Live_Backgrounds.exe](/component/live-backgrounds-exe) — S̶̈́͂IX BILLIÖ̴́N HERSELF · $19 — Animated backgrounds, 19 presets
-   [Drumskin](/component/drumskin) — KOJA Studios · Free — Interactive dot grid background
-   [Eclipse Ring](/component/eclipse-ring) — Lunaut Studio · $9 — A total eclipse for your hero
-   [Pixel Flicker](/component/pixel-flicker) — Design Foundry · $10 — premium animated pixel background