Flutter Gems
Flutter Gems is a curated list of 7250+ useful Dart & Flutter packages that are categorized based on functionality.
Top Flutter Background Effects, Gradients and Shaders packages
Last updated: May 18, 2026
Visual effects, gradients, and custom shaders (Fragment Shaders via Impeller/Skia) allow for stunning, hardware-accelerated visuals like water ripples, dynamic lighting, and complex color blending.
Best Practices for Effects & Shaders
- Impeller Engine: Ensure your shaders are compatible with Flutter's new Impeller rendering engine. Older GLSL shaders may need to be migrated to the new
.fragformat for optimal performance on iOS and modern Android devices. - Subtle Gradients: Avoid harsh, high-contrast linear gradients. Use subtle, multi-stop radial or sweep gradients to create a premium, modern aesthetic.
- Backdrop Filters: Use
BackdropFilterto apply effects (like blurs or color matrices) to the widgets behind the current element, which is the foundational technique for glassmorphism.
The complete list of Gradient, Shader, Particle Effect, and Visual Manipulation packages for Flutter is provided below.
flutter_shaders
👍 125 ⬇️ 873.4K
Dart 3 compatibleMaintenance Status: Average
A collection of utilities for working with the FragmentProgram API in Flutter.
animated_background
👍 311 ⬇️ 1.9K
Dart 3 compatibleMaintenance Status: Poor
Animated Backgrounds for Flutter. Easily extended to paint whatever you want on the canvas.
mesh_gradient
👍 277 ⬇️ 18.8K
Dart 3 compatibleMaintenance Status: Average
Widgets which create beautiful fluid-like mesh gradients in Flutter.
animate_gradient
👍 213 ⬇️ 2.7K
Dart 3 compatibleMaintenance Status: Good
This Package lets you make animated gradients without any hassle. Just pass the primary and secondary colors and you're done.
mesh
👍 175 ⬇️ 34.6K
Dart 3 compatibleMaintenance Status: Average
Fast and highly customizable animated Mesh Gradients for Flutter applications. Using Shaders and vertices.
particles_flutter
👍 188 ⬇️ 1.3K
Dart 3 compatibleMaintenance Status: Good
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.
patterns_canvas
👍 115 ⬇️ 42.3K
Dart 3 compatibleMaintenance Status: Good
Draw patterns like stripes or dots on canvas elements or widgets.
flutter_shaders_ui
👍 34 ⬇️ 140.1K
Dart 3 compatibleMaintenance Status: Good
Collection of beautiful, ready-to-use Flutter widgets powered by GLSL fragment shaders. Blur, glow, noise, gradients and more.
particle_field
👍 142 ⬇️ 1.1K
Dart 3 compatibleMaintenance Status: Poor
A Flutter Widget for adding high performance custom particle effects to your UI.
weather_animation
👍 132 ⬇️ 410
Dart 3 compatibleMaintenance Status: Good
The package contains beautiful weather animations. Easy setup with the weather configurator!
newton_particles
👍 123 ⬇️ 890
Dart 3 compatibleMaintenance Status: Good
Create stunning animations with configurable particle emitters. Add rain, smoke, and more effects to your Flutter app!
parallax_sensors_bg
👍 115 ⬇️ 410
Dart 3 compatibleMaintenance Status: Poor
Flutter package to simplify giving a parallax effect in the background of a page that responds to a corresponding sensor detection.
animated_glitch
👍 107 ⬇️ 51
Dart 3 compatibleMaintenance Status: Poor
Animated Glitch is a Flutter package that allows you to easily create glitch effects and control them
metaballs
👍 98 ⬇️ 302
Dart 3 compatibleMaintenance Status: Poor
A metaballs implementation for flutter using webgl on the web and the shader package on other devices
reflective_visual
👍 93 ⬇️ 17
Dart 3 compatibleMaintenance Status: Poor
Reflective visual for flutter apps.
parallax_rain
👍 88 ⬇️ 79
Dart 3 compatibleMaintenance Status: Poor
Use this package to create cool 3D rain effects. Customize with multiple colors, different raindrop speeds, drop trail effects and more!
floating_bubbles
👍 86 ⬇️ 1.8K
Dart 3 compatibleMaintenance Status: Poor
A Flutter Package for adding Floating bubbles on the Foreground to any Flutter widget.
flutter_weather_bg_null_safety
👍 76 ⬇️ 85
Dart 3 compatibleMaintenance Status: Poor
Provide a variety of weather background animation effects, covering 15 weather types, including sunny,rain,snow...
aura_box
👍 73 ⬇️ 338
Dart 3 compatibleMaintenance Status: Poor
Flutter Widget that combines multiple radial gradients and blur effect.
vitality
👍 70 ⬇️ 152
Dart 3 compatibleMaintenance Status: Poor
Add captivating live animations to your Flutter app effortlessly with Vitality!
particles_network
👍 63 ⬇️ 5.1K
Dart 3 compatibleMaintenance Status: Good
A performant and customizable interactive particle network widget for Flutter. Ideal for background animations, landing pages, and visual effects.
snow_fall_animation
👍 64 ⬇️ 12
Dart 3 compatibleMaintenance Status: Average
A Flutter plugin that creates beautiful snowfall animations and effects
shader
👍 63 ⬇️ 28
Dart 3 compatibleMaintenance Status: Poor
Command-line application for compiling GLSL shaders into Flutter-compatible SPR-V byte code.
scaffold_gradient_background
👍 60 ⬇️ 12
Dart 3 compatibleMaintenance Status: Poor
A widget that works like a scaffold, except that you can set a gradient as background.
shader_buffers
👍 59 ⬇️ 484
Dart 3 compatibleMaintenance Status: Good
Using shaders to feed a shader. Make shaders simplier to use with a focus on the ShaderToy.com website.
flutter_weather_bg
👍 57 ⬇️ 245
Dart 3 compatibleMaintenance Status: Good
Provide a variety of weather background animation effects, covering 15 weather types, including sunny,rain,snow...
particles_fly
👍 55 ⬇️ 83
Dart 3 compatibleMaintenance Status: Average
A package that provides an easy way to add particles js in flutter project.
dynamic_background
👍 52 ⬇️ 448
Dart 3 compatibleMaintenance Status: Average
Allows developers to create animated backgrounds for their Flutter apps.
magnifying_glass
👍 51 ⬇️ 143
Dart 3 compatibleMaintenance Status: Average
Flutter real-time magnifying glass lens widget with Barrel/Pincushion distortion.
particular
👍 48 ⬇️ 55
Dart 3 compatibleMaintenance Status: Average
The Particular is a high performance particle effects flutter widget.
shader_presets
👍 45 ⬇️ 26
Dart 3 compatibleMaintenance Status: Good
A bunch of ready to use shader presets using shader_buffers package
fluid_background
👍 43 ⬇️ 1.7K
Dart 3 compatibleMaintenance Status: Good
Create stunning fluid backgrounds with procedure-animated colorful bubbles and built-in blur effects for a dynamic and modern UI
background
👍 44 ⬇️ 154
Dart 3 compatibleMaintenance Status: Good
A Flutter package to display images or videos as backgrounds.
gooey
👍 43 ⬇️ 445
Dart 3 compatibleMaintenance Status: Good
A layout-agnostic gooey/metaball effect widget for Flutter. Makes nearby elements appear to merge together like liquid
fancy_containers
👍 42 ⬇️ 39
Dart 3 compatibleMaintenance Status: Poor
Fancy Containers Flutter Package
parallax_effect
👍 42 ⬇️ 23
Dart 3 compatibleMaintenance Status: Poor
Parallax effect animations for all platforms.
cool_background_animation
👍 40 ⬇️ 62
Dart 3 compatibleMaintenance Status: Good
A Flutter package for stunning and customizable background animations.
live_background
👍 40 ⬇️ 42
Dart 3 compatibleMaintenance Status: Poor
Provide nice moving particle bokeh effect wall paper on your background.
glopos
👍 39 ⬇️ 27
Dart 3 compatibleMaintenance Status: Poor
View elements in a global scene through local windows. Create effects which visually connect separate UI elements.
awesome_aurora_gradient
👍 39 ⬇️ 7
Dart 3 compatibleMaintenance Status: Poor
A very colourful extension to create awesome Aurora gradients.
eeffects
👍 38 ⬇️ 26
Dart 3 compatibleMaintenance Status: Poor
Flutter package containing a variety of simple 2D effects. Point Lights, Light Beams, fire and Lightning Bolts so far.
aurora
👍 36 ⬇️ 225
Dart 3 compatibleMaintenance Status: Poor
Widget to easily create aurora gradient backgrounds for your flutter app
umbra_cli
👍 35 ⬇️ 24
Dart 3 compatibleMaintenance Status: Poor
Umbra CLI allows Flutter developers to create their own shaders and compile them to strongly typed dart files.
animated_gradient
👍 31 ⬇️ 2.6K
Dart 3 compatibleMaintenance Status: Poor
plugin to create animated gradient background with muliple color in flutter project
flutter_moving_background
👍 33 ⬇️ 61
Dart 3 compatibleMaintenance Status: Good
A Flutter Package to create beautiful and animated backgrounds,such as gradients ,circular forms and particles
parallax_bg
👍 31 ⬇️ 29
Dart 3 compatibleMaintenance Status: Poor
Create beautiful & interactive parallax backgrounds
starsview
👍 29 ⬇️ 54
Dart 3 compatibleMaintenance Status: Poor
AnimatedStarsView for Flutter. The widget provides a view with an animated starry night sky effect.
gen_art_bg
👍 22 ⬇️ 122
Dart 3 compatibleMaintenance Status: Good
Flutter Animated Generative Art Backgrounds collection. Can be used as a background or separately.
flutter_opengl
👍 19 ⬇️ 26
Dart 3 compatibleMaintenance Status: Poor
Flutter plugin to bind a Texture widget to an OpenGL ES context. Many ShaderToy shaders can be used
lava_lamp_effect
👍 7 ⬇️ 98
Dart 3 compatibleMaintenance Status: Average
A widget that provides a customizable lava lamp effect with fluid animations, adjustable colors, sizes, and speeds.
foil
👍 110 ⬇️ 6
Maintenance Status: Poor
Wrap a widget with Foil, providing a rainbow shimmer that twinkles as the accelerometer moves as well as tons of neat gradient features.
gradient_widgets
👍 89 ⬇️ 691
Maintenance Status: Poor
A minimal set of Flutter widgets encased with beautiful gradients.
water_drop
👍 36 ⬇️ 6
Maintenance Status: Poor
A package for creating water drops on top of your widgets.