This week let's explore some interesting CSS challenges with scroll-linked animations, learning about users' motion preferences, and optimising data grids!

Articles

Scroll-Linked Animations With the Web Animations API (WAAPI) and ScrollTimeline — css-tricks.com

Make use of the latest web animation API specifications and use ScrollTimeline

Respecting Users’ Motion Preferences — www.smashingmagazine.com

How to support the prefers-reduced-motion media query and why we should use it today to make your sites more accessible

How I made Google’s data grid scroll 10x faster with one line of CSS — medium.com

A great overview of how to debug and diagnose scroll performance issues, and solved using CSS

Inspiration

CSS Squid Game — thomaspark.co

The games from the TV show recreated in HTML and CSS!

Full Screen Vertical Scroll Snap

One to bookmark - this scroll snapping feels great

Impossible Checkbox v2 🐻

A frustrating checkbox!

Profile Card Hover Effect

I do love a good card hover effect

Handy tools

Animated Backgrounds

A handy resource if you're looking for animated backgrounds for your website