The Web Animation Performance Tier List
Matt Perry created an in-depth guide to animation performance, covering when to use will-change, why CSS variables are bad, what hardware acceleration means, and more.
Issue #627
Crafting Generative CSS Worlds
Agustin Capeletto explores how stacked grids and 3D transforms can bring heightmaps to life using nothing but the power of CSS.
From Our Sponsor
Build High-Quality, High-Converting Free WordPress Forms Fast with IvyForms
Tired of WordPress form builders that fight you—or hide basics behind a paywall?
IvyForms removes the friction.
You get a highly intuitive backend, visibility into all of your entries, and settings to fine-tune the look and experience of your forms.
CSS Weekly on YouTube
▶ Fix "width: 100%" Overflow Easily
A brief guide for the upcoming ‘stretch‘ value in CSS, which forces the element to take 100% width/height of the parent container while taking padding & margin into consideration, thus preventing unwanted overflow easily without using calc() or box-sizing.
▶ Frontend News #17: Why Pseudo-Elements Don’t Work With :is(), the Advantages of OKLCH, & More
Find out why pseudo-elements (::before, ::after) don’t work with the ‘:is()’ pseudo-class function, what the difference between HSL and OKLCH color formats is, why you’re not writing as much code as you’d like at work, and more.
Sponsored Link
The #1 Vue.js training platform helping 200K+ developers level up
Vue School is where developers master Vue and Nuxt through hands-on learning and expert-led workshops. Unlock full access and claim $2,000+ in free bonuses while they last. Super Early Bird ends soon.
Inspiration
CSS Shape (RACER)
Niklas Knaack created a CSS-only racing game without a single line of JavaScript or any external libraries. Both the race track and the cars follow the same path defined by the new shape() function in CSS, making this a showcase of what modern CSS can do.