Tech News
← Back to articles

TIL you can make "GIFs" with SVGs for GitHub README.md files

read original related products more articles

The moving image below is only 49Kb and has an incredibly high resolution.

It's similar to a GIF but instead of showing moving images, it shows moving SVGs! The best part: Github supports these in their README.md files!

Getting these to work involves asciinema and svg-term-cli. After uploading the asciinema you can use the tool to download a file that you can immediately click and drag into a README. It's something that I'm using extensively on bespoken.

How it works?

I was surpised to learn that moving SVGs were even a thing. But then I was reminded that animations are built into the svg spec.

- animates individual attributes over time

- animates individual attributes over time - animates transformations like rotation, scaling, translation

- animates transformations like rotation, scaling, translation - moves elements along a path