--- title: Animate SVG Assets In a Snap description: This week Adobe announced the release of a new and open-source JavaScript library that will enable d... image: https://www.websitemagazine.com/hubfs/Imported_Blog_Media/snapsvg-1-1-1-1.jpg --- [Log In](https://www.websitemagazine.com/_hcms/mem/login) [Subscribe](https://websitemagazine.tradepub.com/free/w_webk05/prgm.cgi) [![Website Magazine Logo](https://www.websitemagazine.com/hs-fs/hubfs/gradient-regular@3x-1.png?width=586&height=145&name=gradient-regular@3x-1.png "Website Magazine Logo")](http://Website%20Services,%20Inc.) - [About](https://www.websitemagazine.com/about) - [FAQs](https://www.websitemagazine.com/about/faq) - [Advertise](https://www.websitemagazine.com/about/advertise) - [Editorial Staff](https://www.websitemagazine.com/about/editorial-publishing-staff) - [Resources](https://websitemagazine.tradepub.com) - [Newsletter](https://www.websitemagazine.com/newsletter-sign-up) - More - [Contact Us](https://www.websitemagazine.com/contact) [Log In](https://www.websitemagazine.com/_hcms/mem/login) [Subscribe](https://websitemagazine.tradepub.com/free/w_webk05/prgm.cgi) Search - [Latest](https://www.websitemagazine.com) - [Design](https://www.websitemagazine.com/web-design) - [Development](https://www.websitemagazine.com/web-development) - [SEO](https://www.websitemagazine.com/seo) - [Ecommerce](https://www.websitemagazine.com/ecommerce) - [Content](https://www.websitemagazine.com/content) - [Marketing](https://www.websitemagazine.com/marketing) - [Advertising](https://www.websitemagazine.com/advertising) - [Email](https://www.websitemagazine.com/email) - [Infographics](https://www.websitemagazine.com/infographics) - [View All Topics](https://www.websitemagazine.com/channels) # Animate SVG Assets In a Snap ![Peter Devereaux](https://www.websitemagazine.com/hubfs/Peter_Devereaux.png) [by Peter Devereaux](https://www.websitemagazine.com/web-design/author/peter-devereaux) 24 Oct, 2013 - - - [mailto:?Body=https://www.websitemagazine.com/web-design/animate-svg-assets-in-a-snap](mailto:?Body=https://www.websitemagazine.com/web-design/animate-svg-assets-in-a-snap) - Link Copied! ![Animate SVG Assets In a Snap](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/snapsvg-1-1-1-1.jpg) **This week Adobe announced the release of a new and open-source JavaScript library that will enable designers and developers to animate and manipulate scalable vector graphics (SVG).** Available free on GitHub, **[Snap.svg](https://snapsvg.io/)** is designed for modern browsers (IE9 and up, Safari, Chrome, Firefox, and Opera), offering capabilities like masking, clipping, patterns, full gradients and groups that will make it a "snap" to create interactive, resolution-independent vector graphics. Perhaps most exciting however is that Snap works with existing SVG assets, meaning SVGs won't have to be created in Snap to work with them. In short, developers will be able to use tools like Illustrator, Inkscape or Sketch and then animate using Snap. "Adobe is passionate about creativity and advancing the modern Web," said Vincent Hardy, director, Web Platform Engineering, Adobe. "We have done extensive work on new technologies like Snap.svg that address the ever-changing needs of designers and developers so that their work can reach the largest audience across browsers." Adobe set up a few demos [here](https://snapsvg.io/demos/), to showcase what's possible with Snap.svg and you'll likely agree the rendered effects are pretty impressive. The solution is already being used on websites including PBS Kids, but expect to see it used increasingly over the coming months and years. "At PBS KIDS our mission is to create engaging content that will educate, inform and inspire kids," said Chris Bishop, creative director, PBS KIDS. "By having Snap.svg in our Web tools arsenal we can now achieve the same type of expressive content that we have on television across various devices in a lightweight, flexible and stunning way without sacrificing quality."   ![](https://www.websitemagazine.com/hs-fs/hubfs/Imported_Blog_Media/pbskids-1-1-1-1.jpg?width=600&height=381&name=pbskids-1-1-1-1.jpg)   ![Peter Devereaux](https://www.websitemagazine.com/hubfs/Peter_Devereaux.png) [Peter Devereaux](https://www.websitemagazine.com/web-design/author/peter-devereaux) As the Editor-in-Chief of Website Magazine and President of Website Services, Peter has established himself as a prominent figure in the digital marketing industry. With a wealth of experience and knowledge, Peter has been a driving force in shaping the landscape of digital marketing. His leadership in creating innovative and targeted marketing campaigns has helped numerous businesses achieve their revenue growth goals. Under his direction, Website Magazine has become a trusted source of information and insights for digital marketers worldwide. As President of Website Services, Peter oversees a team of talented professionals who specialize in SEO/SEM, email marketing, social media, and digital advertising. Through his hands-on approach, he ensures that his team delivers exceptional results to their clients. With a passion for digital marketing, Peter is committed to staying up-to-date with the latest industry trends and technologies, making him a sought-after thought leader in the field. - - - - - [mailto:peter.devereaux@websitemagazine.com](mailto:peter.devereaux@websitemagazine.com) #### Popular Post ### [6 Sexy Web Design Agency Websites ![6 Sexy Web Design Agency Websites](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-19-54-9734-PM-Apr-10-2023-01-58-57-4342-PM-Apr-25-2023-03-47-11-5390-AM-May-01-2023-10-24-02-6643-PM.png)](https://www.websitemagazine.com/web-design/6-sexy-web-design-agency-websites) ### [Six User Testing Questions to Ask While Navigating Website Redesigns ![Six User Testing Questions to Ask While Navigating Website Redesigns](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/question-mark483bf98ec5e163acbc5dff0000ff1aaa-3-1-1-1.png)](https://www.websitemagazine.com/web-design/six-user-testing-questions-to-ask-while-navigating-website-redesigns) ### [The Most Popular Fonts of 2015 ![The Most Popular Fonts of 2015](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/serifshot-3-1-1-1.jpg)](https://www.websitemagazine.com/web-design/the-most-popular-fonts) #### Subscribe to Our Newsletter! [![](https://a.impactradius-go.com/display-ad/13053-1438301)](https://semrush.sjv.io/c/3976891/1438301/13053)![](https://imp.pxf.io/i/3976891/1438301/13053) #### Latest in Web Design [![The Vertical Split Screen Design Trend](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-12-54-4429-PM-Apr-25-2023-04-00-11-0245-AM-May-01-2023-10-36-44-2646-PM.png) The Vertical Split Screen Design Trend](https://www.websitemagazine.com/web-design/slicing-dicing-the-split-stacked-screens-trend) [![Six User Testing Questions to Ask While Navigating Website Redesigns](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/question-mark483bf98ec5e163acbc5dff0000ff1aaa-3-1-1-1.png) Six User Testing Questions to Ask While Navigating Website Redesigns](https://www.websitemagazine.com/web-design/six-user-testing-questions-to-ask-while-navigating-website-redesigns) [![Design for Conversion: Apply the Von Restorff Effect](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/unsplash-53117-Jan-23-2023-02-22-47-9807-PM-1-1-1.jpg) Design for Conversion: Apply the Von Restorff Effect](https://www.websitemagazine.com/web-design/design-for-conversion-apply-the-von-restorff-effect) [![Why Modern Web Design Is No More: The New Era of 'Product Design'](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-24-25-7392-PM-Apr-10-2023-02-13-05-1129-PM-Apr-25-2023-04-00-33-0074-AM-May-01-2023-10-36-52-3196-PM.png) Why Modern Web Design Is No More: The New Era of 'Product Design'](https://www.websitemagazine.com/web-design/why-modern-web-design-is-no-more-the-new-era-of-product-design) [![Before and After: Transforming Email Design with the 3 P's](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-12-54-4429-PM-Apr-25-2023-04-00-11-0245-AM-May-01-2023-10-36-44-2646-PM.png) Before and After: Transforming Email Design with the 3 P's](https://www.websitemagazine.com/web-design/before-and-after-transforming-email-design-with-the-3-p-s) [![5 Fab, Fresh & Free Animation Libraries](https://www.websitemagazine.com/hubfs/Imported_Blog_Media/gradient-regular-logo-mark-Jan-23-2023-02-16-08-6449-PM-Apr-10-2023-02-12-54-4429-PM-Apr-25-2023-04-00-11-0245-AM-May-01-2023-10-36-44-2646-PM.png) 5 Fab, Fresh & Free Animation Libraries](https://www.websitemagazine.com/web-design/5-fab-fresh-free-animation-libraries) [![gradient-regular@3x](https://www.websitemagazine.com/hs-fs/hubfs/gradient-regular@3x.png?width=128&height=128&name=gradient-regular@3x.png)](https://www.websitemagazine.com/) 999 E Touhy Ave, Des Plaines, IL 60018   [info@websitemagazine.com](mailto:info@websitemagazine.com) [(888) 7WEBMAG](tel:18887932624) [(312) 313-6576](tel:13123136576) About - [Advertise](https://www.websitemagazine.com/about/advertise) - [Editorial](https://www.websitemagazine.com/about/editorial-publishing-staff) - [Contact Us](https://www.websitemagazine.com/contact) Resources Membership - Login - Subscribe Signup for our newsletter © 2026 Website Magazine. All Rights Reserved - [Privacy Policy](https://www.websitemagazine.com/about/privacy) ```json { "@context" : "https://schema.org", "@type" : "BlogPosting", "author" : { "@type" : "Person", "name" : "Peter Devereaux", "url" : "https://www.websitemagazine.com/web-design/author/peter-devereaux" }, "dateModified" : "2023-05-01T22:24:46.917Z", "datePublished" : "2013-10-24T05:00:00.000Z", "headline" : "Animate SVG Assets In a Snap", "image" : [ "https://www.websitemagazine.com/hubfs/Imported_Blog_Media/snapsvg-1-1-1-1.jpg" ], "mainEntityOfPage" : { "@id" : "https://www.websitemagazine.com/web-design/animate-svg-assets-in-a-snap", "@type" : "WebPage" }, "publisher" : { "@type" : "Organization", "logo" : { "@type" : "ImageObject", "url" : "https://www.websitemagazine.com/hubfs/gradient-regular@3x-1.png" }, "name" : "Website Services, Inc." } } ``` ```json { "@context" : "https://schema.org", "@type" : "NewsArticle", "author" : [ { "@type" : "Person", "name" : "Peter Devereaux" } ], "headline" : "Animate SVG Assets In a Snap", "publisher" : { "name" : "Website Magazine", "url" : "https://www.websitemagazine.com/" } } ```