Google Material Design's Animated Loading Spinner Using HTML, CSS and SVG
5 December 2014
At SoPost, we’ve been inspired by some of the principles put forward in Google’s Material Design. One element that we thought could be really useful as a feedback mechanism in our user journey was the loading spinner. Creating it in HTML, CSS and SVG allows us to change the colour to fit in with the brand on a per campaign basis.
I have recently stumbled upon jczimm’s version built purely in HTML, CSS and SVG.
I’m going to break down exactly how this works in a future update to this post, but for now, here’s the code for a Material Design spinner: