Collections are the perfect way to group and share Pens. We’ve just given them a big round of improvements including reordering, sorting, and commenting!


Many of you (including some of our own Team CodePen members) have been asking for the ability to reorder Collections. A simple request on the surface, but it required a lot of reworking and rethinking all the way from the database to the UI.

Now that we’ve done the heavy lifting, reordering is as simple as dragging & dropping or typing in an exact position!

Got a step-by-step process you want to share in a specific order? Want to feature some great examples of your new library? Order them however you like!

Fresher Look

Collections got a fresh coat of paint! The layout has been streamlined to keep the content front & center.


By default Collections are sorted by the given order but you can also sort by the most recent additions, newest Pens and more!

Changing these controls also updates the URL so you can easily share a specific view.

Details & Comments

See more details down below and add comments, just like a Pen! Perhaps suggest some new Pens to add or get some more details on a technique.

Learn More

We have much more in the Collections Documentation, and you can hear us dive into the new Collection features and the behind-the-scenes work on CodePen Radio #281: Collection Reordering.