Squarespace Seven Deconstructed

Squarespace Seven Deconstructed

How to animate SVG on scroll? Squarespace Seven landing pages contain some cool animations and in my latest deconstruction you’ll find out how some of them were created.

SVG Scrolling Animation

Squarespace Seven Deconstructed

In my recent deconstruction I’ve looked under the hood of this creative scrolling animation from Squarespace.


They are animating three lines of an iPad SVG, which then fades out to a full color image underneath.

Check out the full deconstruction to learn how was the Skrollr SVG animation created.


Have you tried to animate SVG using Skrollr on your own project?

What would be your approach for a similar effect?

Let me know in the comments below.

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.