Google's transforming material icons in HTML and CSS (cloudcannon.com)

over 5 years ago from George Phillips, CTO at Cloud Cannon

10 comments

Oliver Johnston, over 5 years ago
Great stuff! Love these deconstructions :)
3 points
David Ingledow, over 5 years ago
Great post George!
Just posted a blog post about SVG + CSS animation for the loading spinner that fixes some of the issues that you encountered:
Google Material Design's Animated Loading Spinner in SVG and CSS
1 point
- George Phillips, over 5 years ago
  Nice, that looks great. I will post that up in the post
  0 points
Joe Bloggs, over 5 years ago
Love it!
1 point
Rikon Rahman, over 5 years ago
Love those ideas!
0 points
Crampa ..., over 5 years ago
When you click the grid, it really needs to complete the animation for mouse behavior. Currently, if this was used in a desktop environment, it looks like my click doesn't process properly
Otherwise it looks very good.
0 points
Lucas Bebber, over 5 years ago
If anyone is interested, I made a number transition similar to Google's in CSS/JS a while ago: http://codepen.io/lbebber/pen/Ecdsb
0 points
- George Phillips, over 5 years ago
  Impressive, that's really well done.
  1 point
- George Phillips, over 5 years ago
  I added it to the post, thanks for the link.
  0 points
  - Lucas Bebber, over 5 years ago
    Hey nice, thanks man
    0 points

Now playing