Squarespace’s New Pro Tools: Granular Control, Fewer Workarounds

I spent last week at Squarespace HQ previewing features that will expand how we build. These tools are clearly aimed at professional designers and developers. Rather watch than read? This blog post is also a video:

Block-Level Animations

We can stop hand-rolling CSS for every effect. The new animation panel lets me pick triggers like scroll, hover, press, or follow, choose a preset, then dial in transforms, duration, delay, and easing. I can start with presets for speed, then refine timing curves and offsets for polish that reads as intentional rather than flashy. The result is cleaner motion and consistent results with zero custom code to maintain.

Mobile View Controls

Hide by device now lives in a simple layers panel. I can design alternate mobile layouts or trim noise on small screens without shape-block masks or other hacks, which reduces fragility during client edits. This means less custom css targeting individual blocks.

Stacks = Flexbox in the Editor

Stacks bring real layout structure into the editor. I can group blocks, set gaps, align and nest, then style the whole group as a single unit that behaves predictably across breakpoints. Items inside a stack will get sizing controls like fixed height, fixed width, and fill, which solves stretched images and misaligned button pairs that have driven some of us nuts. Nested stacks will unlock well-balanced card grids and text tables that look great at every screen size.

Some Use Cases

• Pin key text while image cards animate on scroll, then keep transforming as the user moves, creating momentum. Use timing and slight scale to guide the eye, and reserve stronger motion for key moments.

• Use a follow trigger on a shape to create a soft spotlight that bridges one section into the next, which feels like an editorial transition. Match color to the outgoing section, then shrink and reposition toward the focal content so the handoff feels fluid.

• Build heroes and tables with Stacks for crisp alignment, then add a subtle stagger to headers or key stats to set reading order.

Bottoms Up

These updates replace custom-coded workarounds with direct control. I can ship faster with cleaner systems and fewer custom snippets, which improves reliability and makes client handoff (and template handoff) simpler. It seems like Squarespace’s product design team’s focus is on power users right now, and I’m stoked! I’ll keep testing as features land, and I’ll fold ‘em into production wherever they make sense.

More Articles