This week: Cookies, Cats, and Crossings
Knitwear Landing Page (CSS Grid, Flexbox, AOS Scrolling Animations)
"Practicing CSS Grid implementation with a simple responsive landing page for a small knitwear brand. Uses Grid & Flexbox, with AOS scrolling animations" from Lauren Chilcote.Sponsored:
WordPress powers 31% of the internet. Use WordPress.com to start, update, and view your site seamlessly from any device. There is a generous free plan, but with any of three affordable paid plans you get a custom domain name and access to advanced design tool.
#CodePenChallenge: Circles 🔵
We bounced into February's Shapes challenge with circles! Check out the Pens from week one of the challenge, including Paulina Hetman's beautiful "Welcome to Paris - Place des Vosges".
Random Quotes from Romantic Films
Valentine's Day is coming! Kevin Newcombe's "romantic" Pen "uses the WikiQuotes API to pull random quotes from romantic films and add them to candy hearts" with some interesting results.Sponsored:
React for Beginners
It's time to learn React.js. With a focus on simplicity and readability, this course will have you building real time applications and dynamic website components in no time!
SVG Filters are 💕
Yoksel creates a psychedelic expanding heart with SVG filters in this hypnotic Pen.
CodePen Radio #209: Chris Gannon
Chris and Marie talk to CodePen community treasure Chris Gannon about how he uses CodePen with clients, how practicing on CodePen makes him better at his craft, and the various tools he's used to do his work over the years.
CSS Position Sticky - How It Really Works!
Elad Shechter gets into all the details and sticking points of `position: sticky;` in this tutorial post with lots of helpful CodePen embeds.
Pure CSS Bun Frog Toggle
jh3y animates @ittybittybun's Twitter explanation of the subtle difference between a bunny and a frog illustration in this interactive Pen.
JustYourAverageOnion translates a Dribbble shot by Steph Werning into CSS in this heartwarming Pen.
Splitting.js: Rough Type
Team CodePen's own Stephen Shaw demonstrates how to get that old-timey typewriter look to your text with Splitting.js.
Cookie Consent Toggle
Darin Senneff takes a whimsical approach to cookie consent with this tasty toggle. Watch what happens when you slide the toggle off!
Alex Goff's animated Pen is "inspired by a trip to Denver and watching the airport train go back and forth across the high desert".
Vintage Analog TV
"A (somewhat) functional black-and-white TV from the early 20th century" by Jon Kantner.