TypeKit Practice has “Edit on CodePen” Links

Our buddy Tim Brown and the team over at Typekit have announced their new sub site TypeKit Practice: Typekit Practice is a collection of resources and a place to try things, hone your skills, and stay sharp. Everyone can practice typography. One of their first lessons is called Using Shades. The lessons provide actual code […]

Embeds Now Default to Running Animations Without Stopping

One thing we did early on in CodePen was to write some code that would stop animations after a certain amount of time when we’re displaying a preview of them in a grid (like the homepage). We let them run at first so you can get a taste of what’s going on in that Pen, […]

Brace Matching Everywhere (and Quotes, Brackets, and Parenthesis!)

We’ve made an improvement to the editor where braces now insert themselves in matching pairs. For instance, in CSS, type: header { and you’ll get header {} automatically (with the cursor in between the braces). This saves a keystroke (since you’ll need to close it for sure anyway), helps prevent errors (especially when using a […]

Better In-Editor Search

Since CodePen is a web page in a web browser, you can use the browser’s search command to find text on any page. This works in the Editor too, and will find code, but it won’t always find all the matches for a bit of code. That’s because CodeMirror does a special thing where not […]

008: Bad Guys

This week, we talk about “bad guys”: the people that make life difficult for the CodePen community, and what we do to mitigate or prevent the damage.

Announcing PRO Teams!

Working together is always more productive and more fun RIGHT?! Right. Today we’re announcing PRO Teams, which will help you do exactly that. Sign up for a Team account and you’ll be able to invite members to your team. Your fellow members will all be granted PRO access, but the billing will be consolidated to […]

Auto Run Setting Now Affects HTML and CSS as well as JS

We’ve long had a setting in the JS editor to stop the JS from executing as you type (as it does by default). Sometimes that can be annoying, for instance, if your Pen is an animated sequence and it keep re-starting over and over and over. We’ve had a number of requests to extend that […]


We support oEmbed now! If you’ve never heard of it, it’s a clever system for making it super easy to embed rich content. For instance, just drop a YouTube video URL on its own line in (say) a blog post, and it will get replaced with an actual embedded video. That’s just how CodePen oEmbed […]

New Feature: Autoprefixer!

You can now use Autoprefixer in your Pens to handle CSS prefixing for you. Autoprefixer is a CSS processor that handles vendor prefixing of your properties and values for you, as needed. This new option sits alongside the option for using -prefix-free that we’ve had for a long time. The CSS settings panel in the […]

007: Complexity

As we’re about ready to release our new PRO Teams feature, we talk about the idea of complexity in web software. This feature was incredibly complex for us, in some ways because software is inherently complex, but much moreso because of how much existing code we have that this new feature touches. Complexity is an […]

← Older posts