Heads up! This blog post hasn't been updated in over 2 years. CodePen is an ever changing place, so if this post references features, you're probably better off checking the docs. Get in touch with support if you have further questions.

What a year! 2016 was the biggest year for CodePen yet. It’s such a joy to show off the top Pens, Collections, and Posts from 2016.

It’s been the greatest pleasure to watch people create such a wide variety of Pens from all over. From Tiffany Rayside’s creativity to Szenia Zadvornykh‘s amazing WebGl creations to Gabi’s glorious guide to flexbox. Waking up each morning to feature Pens is a perpetual delight.

This past year, we’ve also seen an amazing community growing around Posts. From Charlotte Dann’s amazing generative art explorations, to Alan Pope’s introduction to React & Redux. This community of mentorship and creativity is growing every day, and is showing no signs of slowing.

Lastly, of course, are the amazing Collections of Pens being amassed. Needless to say, if you’re looking for inspiration, implementations, or just plain utility, you’ll find it in a Collection.

Congratulations to everyone who’s made the list! But more importantly, thank you to everyone who’s made Pens, Posts, and Collections this year. Your positive attitudes, sharing, and smiles are what makes CodePen a bigger and brighter place every day!


As always, the Pens, Posts, and Collections are all organized by the total amount of hearts they received during 2016. Keep in mind you can heart something up to three times on CodePen. So, you might see something with a lower number of hearts shown on the Pen above one with a higher number. The one above has more 2-and-3 hearts.