CSS Radio Buttons

Tristan White demonstrates a very clean way to replace browser native radio buttons with custom ones with a pseudo element on the label.

Dublin, Ireland Meetup This Week!

Join #CodePenDublin at Accenture Innovation Center on December 14th

A speed-improved perlin and simplex noise algorithms for 2D

Jonathan Cutrell left this unnamed, but it looks kinda like Predator-vision heatmaps only made from a grid of circles on <canvas>.

Companies Use CodePen For Lots of Reasons

It's true. The might have a Team account and work together prototyping and showing clients in-progress work. They might use customized Embedded Pens. They might show off what their product can do. They might use our prefill API to allow their customers to play.

Just a computer with code and stuff

How so many of us spend our days.

Equal Love 🌈

If you're going to use a loader, it might as well be a rainbow heart, right? A lovoader? This one by yumeeeei was really cleanly constructed with nice Jade and Stylus abstractions. Check out their profile too, which has lots of lovely visual experiments.

xRjLog

Martijn Brekelmans left this Pen untitled, but if we could title it, perhaps we'd go with "Kinda like the writings on the One Ring but even awesomer, like the power is escaping into the world." He said it took 4 days to make!

Game of Life (React + Redux)

Interested in learning Redux in addition to React? Need a jumping off point? Peter Daily wrote

Go PRO on CodePen

Unlock the full power of CodePen with features like Live View, Asset Uploading, Presentation View, and many more.

Animated SVG Turbulence Filter

Lovely use of <feTurbulence type="turbulence" ...> by Gabi, inspired by another amazing Pen you'll have to check the Pen's description to see!

Chris Gannon

Chris is an incredibly prolific illustrator and animator, often working in SVG. His profile is full of a mix of fun, practical, and weird demos, usually with a dash of whimsy. And hey, he's for hire!

Slanted CSS for a more intriguing looking page

How do you set content with sections that are at a slant? As in, not straight horizontal lines across, but those at an angle? This covers the many different ways, good and bad.

Split 3D Carousel

Paul Noble: "A new spin on the carousel pattern with a split panel transition in three dimensions."

ES6 Sampler #6 Odds & Ends

Eugenio Keno Leon's final installment of a 6-part series on ES6. It's set up as a list of challenges with both ES5 and ES6 code presented side-by-side in embeds.