Better hover transitions
When designing hover transitions for links, buttons, etc (especially in lists),
add hover:duration-0 (or the vanilla CSS equivalent) to make the transition instant
when hovering, while still allowing for a smooth transition when the hover state
is removed. For transitions seen hundreds, or thousands of times per day, this
small detail can make a big difference to the perceived snappiness of your UI.
without hover:duration-0
Item 1
Item 2
Item 3
Item 4
Item 5
Item 6
with hover:duration-0
Item 1
Item 2
Item 3
Item 4
Item 5
Item 6
Credit to Emil Kowalski for sharing this tip on Twitter/X.