Randomly distribute circles and rectangles across a website

This playful effect adds randomly positioned circles and rectangles to a website. Inspired by an effect seen on the Webflow Conf 2022 website, the elements disappear when hovered and reappear somewhere else on the page.

The effect uses lightweight JavaScript and CSS and can be added to a section with a simple attribute.

Benefits of this Webflow effect:

1. Visual interest: The moving shapes add a playful, distinctive layer to the design.
2. Interactive: Elements react to hover by disappearing and appearing in a new position.
3. Distinctive design: The effect can help a page feel more dynamic and unconventional.
4. Motion: Repositioning the elements adds subtle energy to otherwise static sections.
5. Easy integration: The JavaScript and CSS can be connected to a section using a single attribute.