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.

March 8th: Bubbles, Blobs, and Beauty

Schema Performance Tuning in MongoDB

Studio 3T's Reschema gives you an incremental way to apply schema & data changes to keep your MongoDB instances clean & performing optimally

VoCSSels - Easily create 3D CSS & HTML Voxel Models

"Build your own 3D CSS and HTML models, export them to CodePen and share with the community. Simply Draw, Extrude, Paint and export!" An incredible browser-based tool from the front-end magician Jamie Coulter.

Responsive CSS Wardrobe

Jhey Tompkins fills a responsive wardrobe with the truth about CSS!

Stacking Cards

Scorecards organize themselves in a super-satisfying stack as you scroll in this UI concept from Mikael Ainalem.

Pop the bubbles! Three.js scene

Stívali Serna is "Having fun with the raycaster!" in this playful animated scene featuring Mr. P from renegades.of.pong on Instagram.

CSS Position:Sticky; with top:0; and bottom:0;

Elad Shechter crafts a helpful demo of the benefits of using position sticky with top and bottom combined if the sticky element is stacked in the middle.

#CodePenChallenge: Purple and Green

The March #CodePenChallenge is all about color harmony, and we of to a super start with the complementary colors purple and green. Check out our Collection of Pens from week one, including Josetxu's "Hulk - Pure CSS".

Netlify

Connect your repository. Add your build settings. Deploy your website. Netlify is the fastest way to get a site live and supports any type of site with a Jamstack architecture. With static global CDN hosting, it is the fastest possible way to host.

CodePen Radio #305: CodePen’s Monorepo

Alex and Chris are on to talk about the glory that is having all of CodePen’s code base in a single repository.

Simple Vue 8 Puzzle

Lee Martin shares a playable sliding number puzzle built in our Vue editor!

Game Disc Beauty

Kiraarghy gathers a Collection of work from a personal challenge: "I really love the gamediscbeauty insta account, so I decided to have a go and try to recreate some of them. Rules: I can only use assets built by myself, Everything must be written on CodePen, I have to recreate 20 discs, The last disc has to be the REZ PS2 disc art"

Image captions & color hints

"Here's what I mean when I say I like to use *CSS gradient color hints* with my 'text over image' designs: the contrast is so MUCH better!" From Adam Argyle.

Yellow

Tiffany Choong continues a series of incredible Pokémon-inspired Pens with this retro GameBoy Color illustration.

Blob Study

Liam Egan casts a white-hot dollop of WebGL in this "3D blob distance field study".