Uses for Infinite Rainbow Gradients

Bernard McDevitt shares some ideas for where you can add a little rainbow brightness to your life. Go forth and make the web fabulous!

Rays and Particles

Johan Karlsson's latest Project is a lovely study of light with p5.js. Move your mouse around to interact with the rays.

Material.io Color Tool

Google's new Material Design color tool helps you build a color and design layout for your UI. When you're done, click the code icon up top to open your design up on CodePen!

ShadersXP 4

There's something strangely calming about alexandrejosephdev's aqua blue ball of shader experimentation.

/r/place

Steve Gardner created "a replica of Reddit's Place, a collaborative drawing app lasting 72hrs on April fools day 2017" with Firebase and Pixi.js.

System Fonts Can Be Beautiful

"Here is an exploration of the fonts Georgia and Trebuchet MS, both system--or web safe--fonts. Brutalism principles strip away but it doesn't mean sites can't be beautiful." - from Brian Haferkamp

Three.js Chameleon

Liza Kobrazova's back with another Three.js experiment! This time, a hopeful chameleon goes through a lot of changes while watching a fly...

Blend Modes: What they are and how to use them

Antoinette Janus transformed her talk at the latest #CodePenDC meetup into a great introductory post on blend modes in CSS.

Isometric Alphabet Animation

Jeselle Obina created an alphabet of SVG isometric animation with a line-drawing motif.

Animated handwriting effect

Craig Roblewsky's two-part tutorial shows you how to make an animated "handwriting" effect with Illustrator and Greensock. Got great penmanship? You can even use your own handwriting!

Vue-controlled Wall-E

Move your mouse or tap the screen to watch Sarah Drasner's Wall-E reach for his cockroach pal in this delightful Vue.js Pen based on Bojan Oreskovic's dribbble shot.

K-2SO

"A single-div CSS gradient drawing of K-2SO from Rogue One" from Jon Kantner