css Audio - Active file-generic CSS - Active Generic - Active HTML - Active JS - Active SVG - Active Text - Active file-generic Video - Active header Love html icon-new-collection icon-person icon-team numbered-list123 pop-out spinner split-screen star tv
CodePen probably won't work great in this browser. We generally only support the major desktop browsers like Chrome, Firefox, Safari, and Edge. Use this one at your own risk! If you're looking to test things, try looking at Pens/Projects in Debug View.
All the can't-miss links.

Delivered straight to your email each week. Go Sign Up.

Add the feed to your favorite RSS reader and never miss a thing.

Sponsor a week and reach a large audience of designers and developers.

June 11th: Toggles, Taps, and Techniques

CodePenChallenge: Cards Roundup - CodePen Blog

Of course good things were in the cards this week! Check out some of our favorites from the first week of the Blogging challenge.

​​Build, test, and deploy something new

Launch your next project on the fastest growing cloud platform for developers. Get started with any new DigitalOcean plan free for 60 days.

CSS Bear Toggle

"A beary cute toggle" from Anastasia Goodwin.

Chicago Meetup Recap

Brian Montana shares stories and snapshots from the latest #CodePenChicago meetup in an awesome blog post!

CodePen on spectrum.chat

We said "Hello World" to our new CodePen community on Spectrum! Come on over and talk shop with your CodePen Pals.

New CSS Techniques at the Component Level

A two-part series from Dockyard exploring CSS grid and "responsive CSS variables", with great embedded demos.

CodePen Radio #177: Measuring

Jake joins Marie to talk about how we're using Ahoy, an open source tool, to measure activity on CodePen.

​Get Your Free .design Domain Name Today!

Your portfolio website will get noticed with a .design domain name. Your free .design name comes with free email hosting, SSL, & a free site builder.

Change Color with Voice (Chrome Only)

George W. Park demonstrates how to use the Speech Recognition API to change an element's color with your voice! Chrome only for now.

Level up your CSS selector skills

David Gwyer demonstrates the potential of advanced CSS selectors, like attribute selectors,UI selectors, and more in this comprehensive tutorial post with lots of helpful demos.

Jacob Wasilkowski on CodePen

A "geospatial developer focused on web mapping, data visualization, and remote sensing" with a map-tastic CodePen profile!

Tappy Loader

Steve Gardner's on a roll, turning out fun and surprising animations like this slightly passive-aggressive loader.

fountains of illumination

A rainbow of beautiful reflecting fountains, from K-T.

Pure CSS Cards Against Developers

jh3y took the card challenge theme in a playful direction with this card game-inspired take on the great developer debate.