A clear glass tumbler with water and bubbles inside, tilted at an angle against a black background.
A reflective, transparent pyramid-shaped object against a black background.

Float animations

  1. Open the CSS panel

    • Pages > Scroll down > Custom Code > Custom CSS or

    • Typing forward slash ( / ), then “CSS”

  2. Copy the Block IDs of the elements you want to animate.

    • You’ll need to install the Squarespace Block ID Finder Chrome extension

  3. Paste the Block ID into the //FLOATING ANIMATED IMAGES section, separated by commas.

  4. Choose your speed: add your IDs under either the “Quicker float” or “Slower float” section — whichever effect you prefer.

TUTORIAL VIDEO