Search
Next Level CSS Styling for Cursors
14.4.2025
Custom cursors with CSS are great, but we can take things to the next level with JavaScript. Using JavaScript, we can transition between cursor states, place dynamic text within the cursor, apply complex animations, and apply filters.
Next Level CSS Styling for Cursors originally published...
Worlds Collide: Keyframe Collision Detection Using Style Queries
31.3.2025
Interactive CSS animations with elements ricocheting off each other seem more plausible in 2025. While it’s unnecessary to implement Pong in CSS, the increasing flexibility and power of CSS reinforce Lee's suspicion that one day it will be a lifestyle choice whether to achieve any given effect with...
Motion Highlights #3
22.3.2025
Fresh animation ideas and motion design trends to fuel your inspiration
A CSS-Only Star Rating Component and More! (Part 2)
7.3.2025
In this second article of a two-part series, Temani Afif demonstrates an alternative approach to creating the star rating component from the first article using experimental scroll-driven animations to animate the star rating's colors in place rather than using the border-image property.
A...
Motion Highlights #2
19.2.2025
A curated selection of the latest motion design and animation trends to keep you inspired and in the loop
Scroll Driven Animations Notebook
13.2.2025
Adam’s such a mad scientist with CSS. He’s been putting together a series of “notebooks” that make it easy for him to demo code. He’s got one for gradient text, one for a comparison slider, another for accordions…
Scroll Driven Animations Notebook originally...
Web-Slinger.css: Across the Swiper-Verse
15.1.2025
Lee Meyer with a super clever idea using scroll-driven animations as an interaction to "like" or "dislike" something.
Web-Slinger.css: Across the Swiper-Verse originally published on CSS-Tricks, which is part of the DigitalOcean family. You should get the newsletter
Motion Highlights #1
9.1.2025
A fresh collection of diverse motion designs and animation concepts to spark your creativity and expand your perspective
Wallace & Gromit Creator Says No Way To A Disney-Like Live-Action Remake
26.12.2024
Over the last few years, we’ve seen a lot of live-action remakes of popular animated movies. Will Wallace & Gromit ever get a Disney-like live-action remake movie? The duo’s creator has a simple answer: “NOOOOO.”Read more
A CSS Wishlist for 2025
23.12.2024
2024 has been one of the greatest years for CSS: cross-document view transitions, scroll-driven animations, anchor positioning, animate to height: auto, and many others. It seems out of touch to ask, but what else do we …
A CSS Wishlist for 2025 originally published on CSS-Tricks, which...
UI Interactions & Animations Roundup #48
12.12.2024
Some fresh hand-picked motion designs and animation concepts for your inspiration
From Product to Cart: Adding Guiding Animations to the Shopping Experience
21.11.2024
An in-depth tutorial on how to create an engaging animation where items move from the product gallery to the shopping cart
Consecutive Scroll Animations with One Element
20.11.2024
A simple concept of animating one element across different waypoints on scroll using GSAP Flip and ScrollTrigger
Popping Comments With CSS Anchor Positioning and View-Driven Animations
6.11.2024
The State of CSS 2024 survey wrapped up and the results are interesting, as always. Even though each section is worth analyzing, we are usually most hyped about the section on the most used CSS features. And if you …
Popping Comments With CSS Anchor Positioning and View-Driven Animations...
Web-Slinger.css: Like Wow.js But With CSS-y Scroll Animations
1.11.2024
Can we recreate a JavaScript library for scrolling animations with a modern CSS approach using CSS Scroll-Driven Animations? Yes. Yes, we can.
Web-Slinger.css: Like Wow.js But With CSS-y Scroll Animations originally published on CSS-Tricks, which is part of the DigitalOcean family. You should...
UI Interactions & Animations Roundup #47
28.10.2024
A set of interesting and inspiring animations and motion design concepts from the past couple of weeks
Unleash the Power of Scroll-Driven Animations
21.10.2024
I’m utterly behind in learning about scroll-driven animations apart from the “reading progress bar” experiments all over CodePen. Well, I’m not exactly “green” on the topic; we’ve published a handful of articles on it including this neat-o one by...
Staggered (3D) Grid Animations with Scroll-Triggered Effects
16.10.2024
A playful concept where we use scroll-based animations to create 3D grid effects and other transitions
Exploring Playful Context-Aware Animations for Fixed Elements
9.10.2024
Exploring how fixed elements can hide and reveal based on scroll interactions with playful, context-aware animations
A Selection of Creative Menu Patterns & Animations
27.9.2024
A selection of creative menu patterns and animations that highlight diverse design styles, offering fresh inspiration for your next project