Barbarian Meets Coding

WebDev, UX & a Pinch of Fantasy

1 minute readbarbaric-tip-of-the-week

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!

Jaime González García

Written by Jaime González García , dad, husband, software engineer, ux designer, amateur pixel artist, tinkerer and master of the arcane arts. You can also find him on Twitter jabbering about random stuff.Jaime González García