CommunityNews

CommunityNews

An Interactive Guide to CSS Transitions

The world of web animations has become a sprawling jungle of tools and technologies. Libraries like GSAP and Framer Motion and React Spring have sprung up to help us add motion to the DOM.

The most fundamental and critical piece, though, is the humble CSS transition. It’s the first animation tool that most front-end devs learn, and it’s a workhorse. Even the most grizzled, weathered animation veterans still reach for this tool often.

There’s a surprising amount of depth to this topic. In this tutorial, we’ll dig in and learn a bit more about CSS transitions, and how we can use them to create lush, polished animations.

This thread was posted by one of our members via one of our news source trackers.

Most Liked

ohm

ohm

Lovely little tutorial. I especially liked the prefers-reduced-motion: reduce. I did not know that was a thing.

Jsdr3398

Jsdr3398

Ooohh this is pretty cool! I really like that you could play around with timelines :astonished:

Where Next?

Popular Frontend topics Top

First poster: bot
Writing Robust TypeScript Libraries — Sympolymathesy, by Chris Krycho. When writing a TypeScript library, it’s helpful to validate all t...
New
AstonJ
Haven’t watched it yet but posting it and bookmarking the thread :nerd_face: TypeScript continues to soar in popularity…
New
AstonJ
By @kobaltz Here’s a related thread about StimulusReflex - an exciting new way to build modern, reactive, real-time apps with Rails.
New
First poster: bot
Why I Love Tailwind. Why Tailwind is blowing up, why I (the creator of styled-components) love it and how I avoid the downsides of atomi...
New
First poster: bot
A WebAssembly Powered Augmented Reality Sudoku Solver. An Augmented Reality Sudoku solver using the WebAssembly build of OpenCV (a C++ ...
New
First poster: bot
ReScript, née BuckleScript, is a state-of-the-art compiler that used to target OCaml (and Reason), but is fast moving away from its paren...
New
First poster: bot
Hey! We’re getting really close to releasing React + Vue support for Tailwind UI, so I thought it would be interesting to share some of t...
New
First poster: bot
Humio software engineers Thomas Anagrius and Jeroen Engels sat down to talk about why they got involved with Elm for web-based front-end ...
New
First poster: bot
I had the chance to toy around with Deno recently. And with “toy around” I mean dissecting it into little pieces and see how the sausage ...
New
First poster: bot
Why in 2021 would you bother making a website without js? While researching this post I found two really great sources of information. S...
/js
New

Other popular topics Top

dasdom
No chair. I have a standing desk. This post was split into a dedicated thread from our thread about chairs :slight_smile:
New
DevotionGeo
I know that -t flag is used along with -i flag for getting an interactive shell. But I cannot digest what the man page for docker run com...
New
AstonJ
We have a thread about the keyboards we have, but what about nice keyboards we come across that we want? If you have seen any that look n...
New
AstonJ
There’s a whole world of custom keycaps out there that I didn’t know existed! Check out all of our Keycaps threads here: https://forum....
New
PragmaticBookshelf
Rust is an exciting new programming language combining the power of C with memory safety, fearless concurrency, and productivity boosters...
New
AstonJ
Thanks to @foxtrottwist’s and @Tomas’s posts in this thread: Poll: Which code editor do you use? I bought Onivim! :nerd_face: https://on...
New
AstonJ
I have seen the keycaps I want - they are due for a group-buy this week but won’t be delivered until October next year!!! :rofl: The Ser...
New
Margaret
Hello content creators! Happy new year. What tech topics do you think will be the focus of 2021? My vote for one topic is ethics in tech...
New
DevotionGeo
The V Programming Language Simple language for building maintainable programs V is already mentioned couple of times in the forum, but I...
New
AstonJ
Biggest jackpot ever apparently! :upside_down_face: I don’t (usually) gamble/play the lottery, but working on a program to predict the...
New