Skip to content

Animated Blobs Generator - Create cool animated GIF or SVG shapes for your designs

License

Notifications You must be signed in to change notification settings

xom9ikk/animated-blobs

Folders and files

NameName
Last commit message
Last commit date

Latest commit

04548b1 Β· Aug 25, 2022

History

62 Commits
Mar 19, 2021
Jan 7, 2021
Jan 7, 2021
Feb 4, 2021
Jan 6, 2021
Jan 7, 2021
Jan 7, 2021
Jan 6, 2021
Jan 7, 2021
Jan 7, 2021
Aug 25, 2022
Mar 19, 2021
Dec 25, 2020
Jan 7, 2021
Mar 19, 2021
Aug 25, 2022
Jan 7, 2021
Jan 6, 2021
Dec 25, 2020

Repository files navigation

Blobs Logo

Animated blobs generator

Blobs Screenshot

For users πŸ˜€

Blob animation is a tool for generating animated blobs. With it, you can generate absolutely any blob animation. This tool also supports gradients.

πŸͺ΅ What can be generated?

You can generate:

  • one animated blob;
  • several animated blobs that you can overlay on top of each other in the future (GIF does not support translucency, so there is such a limitation);
  • non-animated SVG blob;
  • for all of the above, you can use a gradient;

πŸš€ How to use?

Using the toolbar, you can change the complexity of the generated blob. You can change the number of points, blob color and gradients! To generate a new blob with the previously specified parameters, press dice button. And when you find a suitable blob form for you, save it by clicking on the download button.

πŸ“¦ Where can these animations be used?

They can be used on websites, in mobile applications, etc. For me personally, they came in handy for creating blob animations in one of my React Native applications. Because generating and animating such blobs in real time takes quite a lot of resources, which cannot be said about GIF animation. After generation, I just overlaid these blobs and made them transparent, and after that I got this result.

✨ Words of gratitude

Special thanks for the library for generating blobs, I want to say @g-harel πŸ”₯

Thanks for porting the library for creating GIF animations @antimatter15 πŸ’ͺ

And thanks for the inspiration to blobmaker.app πŸ’‘

I hope this will be useful to someone. For all contacts with me, use either github @xom9ikk or telegram @xom9ik.

For developers πŸ€”

Installation and Development server

Clone repo

$ git clone https://github.com/xom9ikk/animated-blobs.git

Install the dependencies

$ npm i

Run in dev mode with hot reload. dev server will run at http://localhost:3000

$ npm run dev

Build for production and run server. production server will run at http://localhost:3000

$ npm run build
$ npm start

License

MIT

About

Animated Blobs Generator - Create cool animated GIF or SVG shapes for your designs

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published