# Updated: Aero Shards

By Steven Van · 2026-10-13

The glass-shard background gains a chrome finish, presets, cursor and click effects, and installs through shadcn in JavaScript or TypeScript variants.

React Bits has rebuilt its [Aero Shards](<https://creatorstoolbox.com/resources/react-bits>) background component. It now renders silk ribbons of thick glass shards that stream smoothly on layered depths, light up along their edges and soften into the distance. The change is listed as an [update on the component's page](<https://reactbits.dev/backgrounds/aero-shards>).

## What was added

- A chrome finish

- Survey markers among the shards

- A cursor that parts the shards

- A light wave on click

- Presets

- An edge fade

## Installing it

The component page offers JavaScript or TypeScript, with plain CSS or Tailwind. The TypeScript and Tailwind version installs with **npx shadcn@latest add @react-bits/AeroShards-TS-TW**. The 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/backgrounds/aero-shards>)

[Read Updated: Aero Shards on Creators Toolbox](<https://creatorstoolbox.com/blog/react-bits-updated-aero-shards>)

---
Canonical source: https://creatorstoolbox.com/blog/react-bits-updated-aero-shards