Astra

Threads

Flowing threads that fray apart and part around the cursor, from fine silk to contour lines.

Threads, a Astra component

Use Threads 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/Threads-TS-TW
How to install Astra components

Related components

  • Floating Lines

    Ribbons of fine glowing lines that drift in waves, part around the cursor and curl when clicked.

  • Waves

    Dense flowing lines that sway like silk, bend around the cursor and spring back into place.

  • Silk

    Flowing satin folds with glossy highlights that turn toward the cursor and ripple on click.