---
title: "Luminous Grid — Free Framer component · Best of Framer"
description: "Free Framer component · by Ava Thiery · Backgrounds. This component creates a sleek animated background made of tiny dots that gently blink, combined with a smooth hover spotlight…"
canonical: "https://framer.elliotli.dev/component/luminous-grid"
---

[Home](/)/[Components](/components)/[Backgrounds](/components/category/backgrounds)/Luminous Grid

# Luminous Grid

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

![Luminous Grid preview image 1](https://framer.elliotli.dev/og/component/luminous-grid/3c6610e1a506c73d/1600x1200.jpg)

## Summary

This component creates a sleek animated background made of tiny dots that gently blink, combined with a smooth hover spotlight effect that follows your cursor.

## Description

This component creates a sleek animated background made of tiny dots that gently blink, combined with a smooth hover spotlight effect that follows your cursor. It’s perfect for adding depth and motion to your hero sections, landing pages, or portfolio layouts.

## Features

-   Interactive dotted grid with smooth hover spotlight effect
    
-   Customizable dot density, size, radius, and color
    
-   Optional image background with adjustable fit
    
-   Toggle hover and animation effects individually
    
-   Lightweight and performance-optimized
    
-   Works seamlessly in any layout
    

## Perfect for

-   Hero sections and headers
    
-   Portfolio and creative studio pages
    
-   Tech and AI-inspired SaaS websites
    
-   Animated visual backgrounds
    

## Customization Options

-   **Grid Density:** control the spacing between dots
    
-   **Dot Size & Radius:** fine-tune the look of each dot
    
-   **Dot Color:** set your brand or theme color
    
-   **Image Background:** overlay your image with the grid for unique effects
    
-   **Hover Size:** adjust how wide the spotlight spreads
    
-   **Hover & Animation Toggles:** easily turn effects on or off
    

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

-   All · #4439

## Details

- **Author**: Ava Thiery
- **Published**: 2025-10-24
- **Updated**: 2025-10-24
- **Added**: 2025-10-16
- **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