---
title: "Flux Grid — Free Framer component · Best of Framer"
description: "Free Framer component · by Milan Dragovic · Effects. Flux Grid is a premium interactive component designed to instantly elevate landing pages, portfolio headers, and dark-mode websites."
canonical: "https://framer.elliotli.dev/component/flux-grid"
---

[Home](/)/[Components](/components)/[Effects](/components/category/effects)/Flux Grid

# Flux Grid

3D interactive pattern

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

![Flux Grid preview image 1](https://framer.elliotli.dev/og/component/flux-grid/84cf0bfc7e9a37f4/1600x1200.jpg)

## Summary

Flux Grid is a premium interactive component designed to instantly elevate landing pages, portfolio headers, and dark-mode websites.

## Description

**Flux Grid** is a premium interactive component designed to instantly elevate landing pages, portfolio headers, and dark-mode websites. Built with smooth WebGL performance and fully integrated into Framer's native properties panel, it brings cinematic, mathematical beauty directly onto your canvas—**zero coding required.**

## Why Your Projects Need This Component

-   **Immersive Cursor Physics:** The rods don't just move—they react. Watch them dynamically pivot away from their fixed bases, lifting into a fluid 3D dome right around your visitor's cursor.
    
-   **100% Native Framer Controls:** Adjust colors, physics, and camera angles on the fly. You get total design freedom without ever touching a single line of code.
    
-   **Silky-Smooth Performance:** High-performance rendering ensures the animation remains incredibly responsive, loading instantly on modern browsers and mobile devices.
    

## Infinite Customization at Your Fingertips

Every parameter of the **Kinetic Wave** is completely customizable directly from the Framer sidebar:

-   **Interactive Physics:** Fine-tune the cursor interaction with adjustable `Hover Radius`, `Repulsion` strength, and `Mouse Snap` speeds.
    
-   **Rod Dynamics:** Easily scale the density, `Rod Height`, and `Rod Width`. Give it a futuristic cyber-aesthetic with adjustable `Tip Glow` and custom `Tip Size`.
    
-   **Dynamic Gradient Colors:** Blend up to **4 distinct rod colors** to create stunning, modern gradients that seamlessly match your brand’s palette.
    
-   **Cinematic Vignette & Depth:** Add depth of field and dramatic shadows with a customizable vignette (`Vignette Strength`, `Vignette Color`, and start/end boundaries) alongside flexible 3D `Camera Angles`.
    

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

-   All · #6034

## Details

- **Author**: Milan Dragovic
- **Published**: 2026-07-16
- **Updated**: 2026-07-16
- **Added**: 2026-07-16
- **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
