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
The
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.

January 21st: Filters, Factories, and Floss

Bob Ross Doing the Floss, Like a Boss (Pure CSS)

Bob takes a break from painting to do some happy little dancing in this charming animated Pen from Steve Gardner.

Georgetown Master's in Design Management

Our part-time and online master's degree prepares you with the business skills and creative thinking strategies you need to maximize impact.

Emoji Factory

Crank out your own custom emoji at Olivia Ng's emoji factory! "About halfway through, I realized how much easier this will be with SVGs instead of CSS, yes. But I was in too deep..."

#CodePenChallenge: Primary Colors 🍎

We went back to basics for week two of the color palettes challenge! Check out the Pens from the primary colors prompt, including halvves' "Random Bauhaus".

Introducing Prefill Embeds!

We just launched a new way to create CodePen embeds on your website. Now you can manage your embeds directly in your site's code!

The simple, secure, send in seconds eSign

HelloSign is the #1 rated eSignature tool. It's the easiest way to sign docs, forms or agreements online. Try it free today!

Harry Potter Puppet Pals: Bother

Christina Gorton "used SVG and GreenSock to create a version of the Harry Potter Puppet Pals episode Bother."

CodePen Radio #206: Prototyping with Dave and Trent

Dave Rupert and Trent Walton crossover from ShopTalk Show to talk about how they use CodePen PRO to build better websites for their clients at Paravel, Inc.

Simplify a Bar Wave Animation

Ana Tudor demonstrates a way to simplify the CSS for a bar wave animation in this live coding video on YouTube.

React’s Hooks in 5 Minutes!

Jhey Tompkins helps you "leave classes behind and grasp this API" in this tutorial post with lots of helpful embedded demos.

New Slack Logo Collection

Hey, did you hear that Slack changed their logo? The CodePen community got right to work and created CSS versions of the new logo, and paid tribute to the old.

Recurrent Neural Network - Rock, Paper, Scissors

"The network learns your pattern of play and tries to guess your next move. I also use a feed-foward network to decide how the computer feels about how the game is going" from Andrew Worcester.

Day 5: Scalable 3D Range Sliders

Angela He selected beautiful colors and patterns for these "3d shaded, scalable range sliders using SCSS, HTML, and some JavaScript".

Gradient Map Filters on Video

Yoksel demonstrates how SVG gradients can work as video filters in this eye-catching fishtank Pen.