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!
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".Sponsored:
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.
Tiffany Choong continues a series of incredible Pokémon-inspired Pens with this retro GameBoy Color illustration.
Liam Egan casts a white-hot dollop of WebGL in this "3D blob distance field study".