Barbaric Tip of The Week: Improve Your CSS Animation Workflow With FireFox Dev Tools Challenger

Barbaric Tip of the Week is a weekly series whose main purpose is to share tiny bits of knowledge that I find specially useful and interesting.

This week’s Barbaric Tip is the great Firefox Dev Tools Challenger, a super creative way to showcase and teach the latest FireFox support for working with CSS Animations. The new animation panel lets you:

  • Play and pause animations (you can also do this in Chrome)
  • Edit cubic beziers
  • Scrub the animation timeline
  • Great support for working with CSS Filters a.k.a. the instagram of the web
  • Use the eyedropper tool to easily select matching colors (also on Chrome)
  • Rewind the animation timeline
  • Detect obscured animations

Check it out at

Dev Tools Challenger

And if you are interested in learning more about Web Animation follow @rachelnabors on the twitterverse and subscribe to her Web Animation Weekly newsletter. Have a great day!