Flutter Loading Animations

A simple yet very customizable set of loading animations for Flutter projects.


Add the following to your pubspec.yaml file:

  loading_animations: "^1.0.0"

Then import the file to your project:

import 'package:loading_animations/loading_animations.dart';

How to use

Choose a loading animation from the list:

  • FlipCircle
  • RotatingSquare
  • FlipBox
  • BouncingGrid

Then add the following code:

  color: Colors.blue,

Or you can customize it a bit:

  borderColor: Colors.cyan,
  size: 30.0,

Or customize it even more!

  borderColor: Colors.cyan,
  borderSize: 3.0,
  size: 30.0,
  backgroundColor: Colors.cyanAccent,
  duration: Duration(milliseconds: 500),

For more customization, please look inside the loading animaton files.

Note: all the animations come ready to go just by calling LoadingFlipBox(), for example.


For a more true experience of the animations and its variations, download the example project and run using flutter run –profile.

LoadingFlipCircle() LoadingRotatingSquare()
LoadingFlipBox() LoadingBouncingGrid()


Please feel free to:

  • ask questions
  • report issues and bugs
  • suggest code improvements
  • request new features

Create an issue or a pull request and I will be more than happy to review it and add to the project.

Source Credit Url : https://github.com/cytryn/loading-animations?fbclid=IwAR2Q5hLpul4JOTpP7q9oQUJj8CMwD1pRuaZBIISEWFtmWbJJ-hWHkH7Zk7w

Leave a comment