# Updated: Acid Squares

By Steven Van · 2026-10-14

The React Bits background now has glossy rolling squares, two moving colored lights, film grain and an intro that starts from the center.

Acid Squares, a background component in [React Bits](<https://creatorstoolbox.com/resources/react-bits>), has been rebuilt as a [rolling field of glossy squares](<https://reactbits.dev/backgrounds/acid-squares>) lit by two drifting colored lights.

## What the new version does

- Squares ripple across the field.

- Film grain is layered over the effect.

- An intro switches the squares on from the center.

## Installing it

The component page offers JavaScript or TypeScript, with plain CSS or Tailwind. The shadcn command for the TypeScript and Tailwind version is npx shadcn@latest add @react-bits/AcidSquares-TS-TW.

![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/backgrounds/acid-squares>)

[Read Updated: Acid Squares on Creators Toolbox](<https://creatorstoolbox.com/blog/react-bits-updated-acid-squares>)

---
Canonical source: https://creatorstoolbox.com/blog/react-bits-updated-acid-squares