CodePen

Chris’ Corner: Tokens

Chris Coyier |
Mr. Brad Frost, and his brother Ian, have a new course they are selling called Subatomic: The Complete Guide to Design Tokens. To be honest, I was a smidge skeptical. I know what a design token is. It’s a variable of a color or font-family or something. I pretty much only work on websites, so […]... read more

Chris’ Corner: Modern CSS Features Coming Together

Chris Coyier |
I like the term “content aware components” like Eric Bailey uses in the Piccalilli article Making content-aware components using CSS :has(), grid, and quantity queries. Does a card have a photo? Yes, do one thing, no, do another. That sort of thing. Eric has some good examples where a UI component h... read more

Chris’ Corner: Liquid Ass

Chris Coyier |
First a quick heads up about… me. I have a weird itch to do “streaming”, so I’m letting myself just be a hardcore beginner and giving it a shot. The plan is just hang out with whoever shows up and make stuff and talk about front end web development and design. So: Seems like those […]... read more

Chris Corner: For The Sake of It

Chris Coyier |
Somebody with good taste could’ve made my website, but then it wouldn’t be mine. My website is ugly because I made it — Taylor Troesh I love weird design ideas. Probably because so much of what we need to do as web designers is, appropriately, somewhat serious. We want things to be simple, clear, pr... read more

Chris’ Corner: Type Stuff!

Chris Coyier |
Let’s do typography stuff!... read more

Chris’ Corner: Doing a Good Job

Chris Coyier |
This is a great story from Dan North about “The Worst Programmer I know”, Tim MacKinnon. It’s a story about measuring developer performance with metrics: We were working for a well-known software consultancy at a Big Bank that decided to introduce individual performance metrics, “for appraisal and p... read more

Chris’ Corner: Design Do’s and Don’ts

Chris Coyier |
I admit I’m a sucker for “do this; don’t do that” (can’t you read the sign) blog posts when it comes to design. Screw nuance, gimme answers. Anthony Hobday has a pretty good one in Visual design rules you can safely follow every time. Erik Kennedy does a pretty good job with posts in this […]... read more

Chris’ Corner: CSS Deep Cuts

Chris Coyier |
Sometimes we gotta get into the unglamorous parts of CSS. I mean *I* think they are pretty glamorous: new syntax, new ideas, new code doing foundational and important things. I just mean things that don’t demo terribly well. Nothing is flying across the screen, anyway.... read more

Chris’ Corner: GSAP, more like FREESap

Chris Coyier |
The news is that GSAP, a hugely popular animation library on CodePen and the web writ large, is now entirely free to use thanks to their being acquired by Webflow. Thanks to Webflow GSAP is now 100% FREE including ALL of the bonus plugins like SplitText, MorphSVG, and all the others that were exclus... read more

Chris’ Corner: Reacting

Chris Coyier |
I was listening to Wes and Scott on a recent episode of Syntax talking about RSCs (React Server Components). I wouldn’t say it was particularly glowing. We use them here at CodePen, and will likely be more and more as we ship more with Next.js, which is part of our most modern stack that we […]... read more