4 Front-end Developers To Follow On CodePen And Why

There are many ways how you can learn new coding techniques, but the one I prefer is to look at a code, break it, fix it, tweak it and all that right in the browser.

Following the right people on CodePen and exploring their demos can teach you a lot.

Follow any of these developers if you want to learn more about CSS or JavaScript animations, SVG, GreenSock or Velocity.js.

1. Sarah Drasner


Sarah is a US based interaction designer at faunadb.com and her CodePen demos are full of SVG, CSS animations and GreenSock.

Also check out her recent post on Smashing Magazine – A Few Different Ways To Use SVG Sprites In Animation, where she explains a few techniques for using SVG sprites in a complex animation.

Responsive SVG Sprite Animation

See the Pen Responsive SVG Sprite Animation that Adjusts Based on Viewport by Sarah Drasner (@sdras) on CodePen.0

Follow Sarah on CodePen or @sarah_edo.

2. Chris Gannon


Chris is a UK based interaction designer and you should follow him to learn more about GreenSock and SVG animations.

Diving SVG Animation

See the Pen Diving SVG Animation by Chris Gannon (@chrisgannon) on CodePen.0

SVG Drip Bounce

See the Pen SVG Drip Bounce by Chris Gannon (@chrisgannon) on CodePen.0

SVG Creeper

See the Pen SVG Creeper by Chris Gannon (@chrisgannon) on CodePen.0

Follow Chris on CodePen or @ChrisGannon.

3. Dennis Gaebel


Dennis is a design technologist from US and his demos will teach you heaps about SVG, GreenSock, ScrollMagic and JavaScript.

SVG Low PolyLion: Animated Polygons

See the Pen SVG Low PolyLion: Animated Polygons by Dennis Gaebel (@grayghostvisuals) on CodePen.02358

Follow Dennis on CodePen or @gryghostvisuals.

4. Rachel Smith


Rachel is an Aussie living in the US. Explore her demos to learn more about CSS animations, SVG, Velocity.js, GreenSock and Snap.svg.

Circles, text and getImageData

See the Pen Circles, text and getImageData by Rachel Smith (@rachsmith) on CodePen.340

Follow Rachel on CodePen or @rachsmithtweets.


Now go and explore any CodePen demo from these developers and I am sure you will learn something new about CSS animations, JavaScript, GreenSock, SVG or Velocity.js.

Did I forget anyone worth mentioning? Who are your favorite developers on CodePen? Let me know in the comments below.

Download Free Toolkit

All you need to know to get started with GreenSock and ScrollMagic, in one single package. Straight into your inbox.

100% Privacy. Guaranteed! Powered by ConvertKit

2 thoughts on “4 Front-end Developers To Follow On CodePen And Why

  1. iMaths

    Hello, thanks for pointing new resources. I love to read blogs and short case-studies, becouse it gives me idea in wich direction I should go and what to learn. It is also great in my situation, becouse I don’t have so much time to read whole documentations etc. I’ve hope that one day I will be able to start my journey about web-development full-time.


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.