# Updated: Cursor Grid

By Steven Van · 2026-10-12

The React Bits Cursor Grid effect now offers tiles, dashed, dot and mark styles, click rings, an intro and a light mode.

Cursor Grid, the [React Bits](<https://creatorstoolbox.com/resources/react-bits>) effect, has been [rebuilt](<https://reactbits.dev/animations/cursor-grid>) as a minimal grid with a soft spotlight that follows the cursor. The cells light up and fade behind the pointer.

## What the rebuilt grid includes

- Highlights for a single cell or for an area

- Tiles, dashed, dot and mark grid styles

- Click rings

- An intro

- A light mode

## Installing it

The component is available in JavaScript or TypeScript, with plain CSS or Tailwind. The TypeScript and Tailwind version installs with npx shadcn@latest add @react-bits/CursorGrid-TS-TW. The page's interactive preview, customization controls and source tabs need JavaScript enabled.

![React Bits](<https://reactbits.dev/favicon.ico>)

React Bits

An open-source collection of 200+ animated, interactive React components and micro-interactions.

[View React Bits →](<https://creatorstoolbox.com/resources/react-bits>)

Sources

[Original source](<https://reactbits.dev/animations/cursor-grid>)

[Read Updated: Cursor Grid on Creators Toolbox](<https://creatorstoolbox.com/blog/react-bits-updated-cursor-grid>)

---
Canonical source: https://creatorstoolbox.com/blog/react-bits-updated-cursor-grid