We had a member ask us if there was a way to create an Editable Embed where all three panels (HTML, CSS, and JS) were visible at the same time for editing. That’s not a default option. Panels in embed are normally tabs, which you would look at one at a time. But, since Editable […]

We’re talking Emmet – a handy toolkit of shortcuts for developers. CodePen just pushed version 2 live (with some customizations!) so we thought we’d talk about how and why we’re using Emmet on CodePen.

There are a couple of little tiny new buttons you’ll see, one in the Pen Editor and one in the Project Editor. It’s this little bugger: It gives you one-click access to pop open a Live View window, which is a real-time updating preview of your code. Live View isn’t only useful for testing other […]

There is something about our Solar System that inspires serious design and development creativity! CSS 3D Solar System by Julian Garnier This is CodePen’s most popular solar system Pen! Not only is it beautiful to look at, it’s very educational and data-based. The whole solar system can be viewed either as flat rings or in […]

When does your web app need more refined and advanced permissions? How does CodePen figure out if you’re a paid user? Or if you’re on a team? What kind of Pro are you? How did CodePen clean up the logic and the questions we were asking?

Folks, we have a winner in our CSS Dev Conf fork challenge. Congratulations Gabrielle Wee!!! 🙌 See the Pen CSS-Only CSS Dev Conf Animation by Gabrielle Wee (@gabriellewee) on CodePen. Gabrielle made wonderful use of Sass in this animated adventure. First, The CSS Dev Conference logo is drawn out with a lovely simple stroke animation. […]

CodePen is all HTTPS now. Hip hip hooray for security! One kinda niche-but-cool use case of CodePen is to use the editor to play with stuff, but also be linking to resources right off your local computer. You spin up a local server and point external resources right at your localhost or whatever you have […]

No problem! There is no UI control in the Embed Theme Builder for font-size, but there is the ability to link up Custom CSS, so that’s the feature we’ll use here. It gives you 100% control over the CSS of your Embedded Pen. Now that we’ve created this new theme (remember CodePen PRO members get […]

Chris, Rachel, and Marie talk about some of the ways they configure templates on CodePen – Pen templates, Project templates, as well as dreaming up new ways to use templates on CodePen.

We just popped a new PRO Perk up. If you’re PRO, you’ll see a button here to redeem your perk. As I type, Iconfinder has 1,739,825 icons avialble to search for, browse for, and download for your own projects. This perk is a $29 gift card, which is good for a month of their Unlimited […]