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.

December 18th: Snowflakes, Sloths, and Soup


"Mini drag & drop library with a 3D pop-out effect. Compresses down to about 1kb" by Shaw.

Next Generation Project Management Tool Is Here

Manage your projects & tasks with ease, plan visually on a timeline see what everyone on your team is working on at a glance.

Winter Tidings

"Enter the enchanted forest, summon the woodland spirits and form a one-of-a-kind snowflake to carry your festive message anywhere in the world" in this gorgeous Pen by Staak.


You could get lost in this collection of vivid canvas mazes from Jerome Cukier.

12 Days of Christmas SVG

Christina Gorton gathers up her holiday-themed SVG Pens into this holly jolly collection!

Fading Love - Interactive / Animated Album Artwork

"An interactive and animated album artwork from George FitzGerald", translated into CSS and JS by Will Donohoe.

CodePen Radio #155: Podcasting

In our final episode for 2017, we're joined by our podcast editor Chris Enns to talk about the hows and whys of producing a podcast about a startup.

GLSL: Primordial Soup

"Fractal noise distortions" create a stunning iridescent fluid in this Pen by Liam Egan.

My Journey with Pure CSS Images

Eleftheria Batsou gives us a behind-the-scenes look at the process and techniques she used while she took the #DailyCSSImages challenge.

Merry Gridmas!

You can do a whole lot with CSS Grid, including put up a Christmas tree. Regis Philibert spreads a little blocky cheer in this charming holiday Pen.


Griffin Moyer takes us deep inside a cell in this hypnotic Pen built with Three.js.

Border Transformations

"CSS patterns made with transformations only on the borders" by Yuanchuan.