Flutter Gems

Browse 4800+ useful Dart & Flutter packages that are neatly categorized!

Twitter Subscribe Medium LinkedIn

Top Flutter Background Effects, Gradients and Shaders packages

Last updated: November 29, 2022

A background can be added to a Flutter app that usually appears underneath other widgets. It can be a static image, a gradient, a motion effect backgroud or can utilize shaders to render realistic effects. Backgrounds help in adding depth to an app.

The complete list of Flutter packages that can add Background Images, Background Effects, Gradients & Shaders to Flutter apps is provided below.


animated_background Card Image
animated_background
Null safety 👍 196

Animated Backgrounds for Flutter. Easily extended to paint whatever you want on the canvas.

particles_flutter Card Image
particles_flutter
Null safety 👍 108

A flutter package for particle animation. You can control the animation speed, number of Particles on the screen, dimension and shape of particle via connecting lines,etc.

gradient_widgets Card Image
gradient_widgets
Null safety 👍 82

A minimal set of Flutter widgets encased with beautiful gradients.

foil Card Image
foil
Null safety 👍 61

Wrap a widget with Foil, providing a rainbow shimmer that twinkles as the accelerometer moves as well as tons of neat gradient features.

shader Card Image
shader
Null safety 👍 53

Command-line application for compiling GLSL shaders into Flutter-compatible SPR-V byte code.

flutter_weather_bg_null_safety Card Image
flutter_weather_bg_null_safety
Null safety 👍 52

Provide a variety of weather background animation effects, covering 15 weather types, including sunny,rain,snow...

patterns_canvas Card Image
patterns_canvas
Null safety 👍 48

Draw patterns like stripes or dots on canvas elements or widgets.

parallax_rain Card Image
parallax_rain
Null safety 👍 40

Use this package to create cool 3D rain effects. Customize with multiple colors, different raindrop speeds, drop trail effects and more!

vitality Card Image
vitality
Null safety 👍 39

A Flutter package that Allows you to create a very beautiful live animations in the background (like randomly moving icons ,circles ,rectangles ....) within 10 lines.

floating_bubbles Card Image
floating_bubbles
Null safety 👍 37

A Flutter Package for adding Floating bubbles on the Foreground to any Flutter widget.

animate_gradient Card Image
animate_gradient
Null safety 👍 34

This Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done.

scaffold_gradient_background Card Image
scaffold_gradient_background
Null safety 👍 30

A widget that works like a scaffold, except that you can set a gradient as background.

glopos Card Image
glopos
Null safety 👍 30

View elements in a global scene through local windows. Create effects which visually connect separate UI elements.

umbra_cli
Null safety 👍 29

Umbra CLI allows Flutter developers to create their own shaders and compile them to strongly typed dart files.

metaballs Card Image
metaballs
Null safety 👍 29

A metaballs implementation for flutter using webgl on the web and the shader package on other devices

particle_field Card Image
particle_field
Null safety 👍 27

A Flutter Widget for adding high performance custom particle effects to your UI.

eeffects
Null safety 👍 24

Flutter package containing a variety of simple 2D effects. Point Lights, Light Beams, fire and Lightning Bolts so far.

awesome_aurora_gradient Card Image
awesome_aurora_gradient
Null safety 👍 24

A very colourful extension to create awesome Aurora gradients.

parallax_bg Card Image
parallax_bg
Null safety 👍 22

Create beautiful & interactive parallax backgrounds

flutter_weather_bg
👍 49

Provide a variety of weather background animation effects, covering 15 weather types, including sunny,rain,snow...

water_drop
👍 32

A package for creating water drops on top of your widgets.