Grid Background | Community Components - 21st | 21st

/Grid Background/

Grid Background

Here is Grid Background component

Install

npx shadcn@latest add https://21st.dev/r/meghtrix/grid-background

Loading preview...

import { Component } from "@/components/ui/grid-background";

export default function DemoOne() {
  return <Component />;
}

More examples

Dark Sphere GridOpen page →

Loading preview...

Magneta Orb GridOpen page →

Loading preview...

Dark Basic GridOpen page →

Loading preview...

Dark Basic Grid FadedOpen page →

Loading preview...

Black Basic GridOpen page →

Loading preview...

Vercel Grid Subtle Open page →

Loading preview...

Dark Grid LinesOpen page →

Loading preview...

Pixel Grid PatternOpen page →

Loading preview...

Neon Vertical LinesOpen page →

Loading preview...

Dark Dot MatrixOpen page →

Loading preview...

Small GridOpen page →

Loading preview...

Black Grid with White DotsOpen page →

Loading preview...

Dark Grid with Whie DotsOpen page →

Loading preview...

Dark Dotted GridOpen page →

Loading preview...

Dark White Dotted GridOpen page →

Loading preview...

Dark Noise ColoredOpen page →

Loading preview...

Matrix GreenOpen page →

Loading preview...

Diagonal Grid GreenOpen page →

Loading preview...

Diagonal Grid ElectricOpen page →

Loading preview...

Complex MultiplierOpen page →

Loading preview...

Hexagonal LightsOpen page →

Loading preview...

Diagonal Grid SynthwaveOpen page →

Loading preview...

Gradient Left Diagonal LinesOpen page →

Loading preview...

Gradient Right Diagonal LinesOpen page →

Loading preview...

Cross Diagonal LinesOpen page →

Loading preview...

Source

patterncraft.fun

Published

9/16/2025

Install

Dependencies

Tags

Featured

Newest

Popular

Shaders

Heros

Features

AI Chat Components

Calls to Action

Buttons

Testimonials

Pricing Sections

Text Components

Install

Dependencies

Tags

Grid Background

Install

More examples

Source

Published

Similar components