July 8th: Seeds, Surfers, and Sliders
Color Mix in Vanilla CSS
"Thought you couldn't apply color functions in vanilla CSS? THINK AGAIN!" Una Kravets demonstrates mixing colors in CSS with calc() and CSS Variables.
Sponsored:
The only CI/CD tool you will ever need.
100+ predefined actions and integrations in a clear & telling UI. Build, test & deploy in seconds. Try Buddy for FREE!
Verly Range Slider
These delightfully dangly range sliders demonstrate Verly.js. From Anurag Hazra.
Simple Fire Animation
A little bit of pixelated fire from Tibixx. Pop open the dat.gui controls to play with fire.
Receipt with 3D Fold Effect
Krisztina Vajda shares a receipt concept with a fun fold-out effect.
Sponsored:
Powerful, easy-to-configure form backend
Go from zero to submission ready without writing a single line of server side code. Your first endpoint is free.
Hard Work
"I'm often asked how to become a good animator. Nobody ever likes the answer...." from animator extraordinaire Chris Gannon.
Searching Rod
"Inspired by the popular Gameboy title and a very cute icon found on Dribbble, create a form allowing to filter fish according to their name" from Gabriele Corti.
CodePenChallenge: Star Wars API
Our July API challenge blasted off with Star Wars! Check out the Pens from week one, including Ryan Mulligan's "Star Wars Opening Crawls". Sponsored by Stream.
CodePen Radio #228: 2019 Trends
We're half way through 2019! Marie and Cassidy are here to talk about what's trending on CodePen so far and take a glimpse at the future for the rest of the year.
Pure CSS Katy
An amazingly-detailed CSS portrait from Malaika Ishtiaq.
Stock imagery Thanos Simulator
Jamie Coulter demonstrates how Thanos would use the Web Audio API in this interactive Pen.
Pixels Are Seeds, Images Are Forests
Stephane Buellet shares a " journey through pixels, video, canvas and SVG export" in this tutorial post with a bunch of truly stunning Pens.
Only CSS: Infinite Wave
An emoji surfer gets an endless summer in this beautiful Pen from Yusuke Nakaya.