React Bits

Chroma Grid

A grid of grayscale photo cards where a spotlight follows the cursor and brings back color.

Chroma Grid, a React Bits component

Use Chroma Grid in your project

Choose JavaScript or TypeScript and plain CSS or Tailwind. Enable JavaScript for the interactive preview, customization controls and source tabs.

npx shadcn@latest add @react-bits/ChromaGrid-TS-TW
How to install React Bits components

Related components

  • Magic Bento

    A bento grid of feature cards with live artwork, edge light that follows the cursor and a click wave.

  • Spotlight Card

    Card lit by a soft spotlight that follows the pointer, catches its edge and reaches nearby cards.

  • Border Glow

    Glowing mesh-gradient border that follows cursor direction and intensifies near edges.