If you have an account on CodePen, you have a profile! If you’re logged in, you can even hit up this generic URL which redirects to it:


Here’s mine, at https://codepen.io/chriscoyier

You’re able to edit your profile, changing your user avatar, your links, bio, and all that. You can even link to CSS to take styling control over your profile! Here’s a little trick for doing that and some examples of that. If you’re PRO, you can add a Pen to the header of your profile by just dropping a link to it in your profile settings.

There is one more thing you can do to customize your profile. Notice in the screenshot above the Pens you see? And the active tab is called “Showcase”? Your Showcase isn’t your most recent Pens or anything like that, it’s an area that is totally customizable by you to show off whatever Pens you like. To pick out these Pens, head to the Organize page which you can get to either by clicking Organize Showcase on your profile or from Settings > Profile.

This page allows you to drag and drop Pens from the left (where you find them) to the right (where they will be placed in your Showcase).

We’ve had this feature for a while, but it’s undergone a revamp just recently to make it lessy buggy and add some features. Most notably, search! It’s not always easy to find the exact Pen you are looking for by trudging through your Popular or Recent Pens, or even by tag. Now you can search for Pens right from this page and find what you need.

Have fun customizing your profile! If you do something really cool, make sure to let us know.