Constellation network
Floating dots joined by thin lines that drift apart when your mouse gets close.
Settings
Code
<div class="pt-constellation"><canvas></canvas></div>Prompt for AI
Paste it into ChatGPT, Claude or Cursor and it will adapt the block to your project with these settings, even if you don’t use React.
More in Backgrounds
Where to use it
Connected particles say “network” without drawing a diagram, so they suit the hero of a data consultancy, a blockchain project or the landing page of a community app. Move the cursor and nearby points step aside and link up to it, which people love playing with. Think of it as an interactive particles background, a lighter take on particles.js.
On phones there’s no hover, so the lines just drift on their own, which still looks fine. Keep the density moderate: every dot checks its distance to every other one, and a very full screen can slow down older laptops.