DEV Community

K M H Mubin
K M H Mubin

Posted on

How to make a GIF?

I want to make some gif for my project tutorial. Generally, I make gif from the recorded video, which looks terrible.
Here is an example that I make:

mygif

But recently, I encountered the website called create react app. In this website, the gif looks more clean and crisp. Here is an example of create react app gif file.

create react app

Can anyone suggest me how to make gif like this and which software should I use to make this kind of gif file?

Advance Thank you.

[note: please forgive my grammar mistake]

Top comments (3)

Collapse
 
alexanderjanke profile image
Alex Janke

If you look at the source of the image you'll end up here camo.githubusercontent.com/29765c4...

Now suddenly you can select text, meaning it's not gif/mp4. If you press Ctrl + U to look at the source again, you'll see it's a SVG-animation. So it's not a gif but a svg animation, that's why it's so crisp.

Collapse
 
bogdaaamn profile image
Bogdan Covrig • Edited

If you're looking for terminal specific recording you can give terminalizer a try, which does exactly what you've seen in the create-react-app docs.

Otherwise, for general purpose, Giphy Capture is pretty cool. It lets you trim and change the settings for each recording, and you can export them as mp4s as well.

Collapse
 
kmhmubin profile image
K M H Mubin

Thank you for suggesting terminalizer. I've been looking for this kind of gif creator.