Background GridFree

A static 3D background grid — a wireframe perspective grid that covers the full container, warped and bowed toward a vanishing point for depth. No animation, no layout shift.

Add to your project

Checking access...

Works with your AI tools

Claude*

Codex*

Lovable

Base44

Figma Make

Replit*

Cursor*

* Compatible with most projects that use the default React/Next.js framework.

Built With

React

Tailwind CSSCanvas API

Props

Prop	Type	Description
`children`	`ReactNode`	Content layered above the grid (headline, CTA, etc.)
`className`	`string`	Styles for the content wrapper
`containerClassName`	`string`	Styles for the outer shell (size, layout)
`theme`	`'dark' \| 'light'`	Preset background and line colors
`backgroundFill`	`string`	Overrides the theme background color (hex)
`lineColor`	`string`	Overrides the theme grid line color (hex)
`cells`	`number`	Grid density (lines per axis)

More Backgrounds Components

Wavy Tide Background

Animated canvas waves that fill the container and drift with the pointer — a softer, SaaS-ready take on classic wavy backgrounds.

Meteor Shower Background

Subtle canvas meteors drifting across a dark sky — a quiet animated background for heroes and landing sections.

Neon Flow Background

Staggered neon trails that sweep across a dark field — colors are prop-driven for easy theming.

Desert Dune Background

Soft layered waves in parallax drift — cool indigo tones by default, colors via props.

Aurora Background

Northern lights as folding canvas curtains: irregular ribbons and faint rays drifting across a night sky.