High-performance, configurable particle system for Flutter.
particle_flow lets you add smooth, lightweight particle effects (snow, confetti, emoji rain, custom widgets, etc.) on top of any UI:
- Canvas-based particles for maximum performance
- Widget-based particles for fully custom content
- Easy overlay API: wrap any widget/page/app with particles using
child - Multiple particle systems at once via
MultiParticleFlow
-
🔹 Two rendering modes
- Canvas mode using
ParticleCanvasPainter(best for many particles: snow, dust, emojis, shapes) - Widget mode using
ParticleWidgetBuilder(icons, images, custom widgets)
- Canvas mode using
-
🔹 Overlay child support
- All core widgets (
ParticleFlow,MultiParticleFlow) accept achild - Your UI renders once; particles are drawn on top
- All core widgets (
-
🔹 Configurable behavior with
ParticleBehavior- Speed, gravity, drift, scale, opacity, lifetime, fade-in/out, rotation
- Built-in preset:
ParticleBehavior.snow()
-
🔹 Flexible spawn with
ParticleSpawnConfig- Spawn from
top,bottom,left,right,sides, orfull - Optional
customArea+spawnPadding
- Spawn from
-
🔹 Multiple systems with
MultiParticleFlow- Layer several particle systems on a single
child - Mix canvas & widget systems
- Layer several particle systems on a single
dependencies:
particle_flow: ^0.0.1 # or the latest versionThen:
flutter pub getimport 'package:particle_flow/particle_flow.dart';import 'package:flutter/material.dart';
import 'package:particle_flow/particle_flow.dart';
class SnowPage extends StatelessWidget {
const SnowPage({super.key});
@override
Widget build(BuildContext context) {
return ParticleFlow.circles(
count: 160,
behavior: const ParticleBehavior.snow(),
spawnConfig: const ParticleSpawnConfig(
origin: ParticleSpawnOrigin.top,
),
child: Scaffold(
backgroundColor: Colors.blueGrey.shade900,
body: const Center(
child: Text(
'Snow overlay',
style: TextStyle(color: Colors.white, fontSize: 24),
),
),
),
);
}
}Main widget for a single particle system.
Convenience constructors:
ParticleFlow.circles(...)ParticleFlow.emoji(...)ParticleFlow.emojis(...)ParticleFlow.widgets(...)
Common parameters:
count– number of particlesbehavior–ParticleBehavior(motion, lifetime, opacity, etc.)spawnConfig–ParticleSpawnConfig(spawn origin/area)isPaused– pause/resume animationseed– optional random seed for deterministic behaviorchild– widget rendered underneath the particle overlay
Combine multiple particle systems on top of a single child.
MultiParticleFlow(
systems: [
ParticleSystemConfig.canvas(...),
ParticleSystemConfig.widgets(...),
],
child: YourPage(),
);systems– list ofParticleSystemConfigisPaused– pause all systems at onceseed– base seed (each system usesseed + index)child– rendered once beneath all particle systems
Controls motion and visual behavior.
- Vertical speed:
minSpeed,maxSpeed - Horizontal speed:
minHorizontalSpeed,maxHorizontalSpeed - Gravity:
gravity - Drift:
horizontalDriftAmplitude,horizontalDriftFrequency - Scale range:
minScale,maxScale - Opacity range:
minOpacity,maxOpacity - Lifetime:
minLifetime,maxLifetime - Fade:
fadeInFraction,fadeOutFraction - Rotation:
rotationSpeed
Helpers:
const ParticleBehavior.snow(...)– preset tuned for soft snow-like motioncopyWith(...)– customize specific fields
Control where particles appear:
const ParticleSpawnConfig({
this.origin = ParticleSpawnOrigin.top,
this.customArea,
this.spawnPadding = EdgeInsets.zero,
});Origins:
ParticleSpawnOrigin.fullParticleSpawnOrigin.topParticleSpawnOrigin.bottomParticleSpawnOrigin.leftParticleSpawnOrigin.rightParticleSpawnOrigin.sides
You can also:
- Limit spawn to a custom rectangle using
customArea - Spawn slightly off-screen using
spawnPadding
More complete and advanced examples (multi-system setups, emojis, custom widgets, etc.) live in:
Run the example app:
cd example
flutter runThis package is distributed under the MIT License. See the LICENSE file for details.