Filmstrip is an online editor that helps you with that task.

Combining the power of both positioning and keyframes CSS properties, you will get CSS code ready to use in your site.

Furthermore, you can place the exported animation anywhere and add on to any element.

Creating new keyframes is easy. Just drag from one point to another.

• No external libraries or technolgies.

Some stuff I want to add:

• Settings: customize animation duration, iteration count, etc.
• Animate other properties: height, width, color, etc.
• Custom images

Just make a pull request if you feel like adding something from the list, or something else entirely :)
Please create a GitHub issue if there is something wrong or needs to be improved.

MIT Copyright © 2020 Ben Hatsor (@benhatsor)