Search packages, repositories and app categories

Package detailsv1.0.1

flutterfx_blur_fade

A Flutter widget that animates children with a combined blur and fade effect. Part of the FlutterFX collection of animated widgets.

AndroidiOSWebmacOSWindowsLinux
30-day downloads
34
Likes
3
Pub points
155

Install package

flutter pub add flutterfx_blur_fade

Package Overview

Package selection guidance compiled from public package information, community data, and project usage.

A Flutter widget from the FlutterFX collection that applies a smooth, combined blur and fade animation to its children. Ideal for creating subtle, elegant transitions in user interfaces, it enhances visual appeal by gradually blurring and fading content in or out. Designed for use in modern app designs where fluid motion and depth are important. Works across all major platforms including Android, iOS, Web, macOS, Windows, and Linux.

Use cases

  • Creating smooth screen transitions
  • Enhancing splash screens
  • Animating card or panel entrances
  • Improving UI depth with subtle effects
  • Adding polish to loading states

Key features

  • Combined blur and fade animation
  • Seamless integration with FlutterFX
  • Cross-platform compatibility
  • Customizable animation duration
  • Supports any child widget
  • Lightweight and performant

Suitable for

  • UI designers seeking polished animations
  • Developers building modern Flutter apps
  • Apps requiring subtle yet impactful transitions
  • Projects using the FlutterFX ecosystem
  • Teams focused on high-quality user experiences

Considerations

  • May impact performance on low-end devices
  • Requires careful tuning of animation parameters
  • Best used sparingly to avoid visual clutter
  • Not suitable for fast-paced, high-frequency animations
  • Depends on FlutterFX core dependencies

Original README

Original README snapshot from the linked source repository. Visit the repository for the latest content.

FlutterFX: A collection of animated effects build with Flutter

Multiple Flutter aniamted effects examples with Flutter.

Each one a building block.

Feel free to use them for your next project.

Star the repo if you find any effect usefull.

📚 View the documentation

Preview

Folder
Folder
Smoke
Smoke
Bookshelf
Bookshelf
Circle Selector
Circle Selector
3D Vinyl
3D Vinyl
BlurFade
BlurFade
Border Beam
Border Beam
Meteors
Meteors
Neon Card
Neon Card
Hyper Text
Hyper Text
Typing Animation
Typing Animation
Rotating Text
Rotating Text
Text Blur
Text Blur
Text Float Blur
Text Float Blur
Text Chaos Blur
Text Chaos Blur
Text Balloon Fizzle
Text Balloon Fizzle
Text Flip
Text Flip
Interactive Globe
Interactive Globe
Celebrate
Celebrate
Tube Light
Tube Light
Life Balance
Life Balance
Avatar Loader
Avatar Loader
Profile Loader
Profile Loader
Animated Grid
Animated Grid
Beam Pattern
Beam Pattern
Ripple Effect
Ripple Effect
Dot Matrix
Dot Matrix
Bottom Sheet
Bottom Sheet
Butterfly Flight
Butterfly Flight
Circular Reveal
Circular Reveal
Transform Guide
Transform Guide
Glowing Bulb
Glowing Bulb
Thread Design
Thread Design
Expand Collapse
Expand Collapse
Beam Burst
Beam Burst
Flickering Cards
Flickering Cards
Dynamic Grid
Dynamic Grid
Gemini Splash
Gemini Splash
Spark Loader
Spark Loader
Blur Grid
Blur Grid
Grid Motion
Grid Motion
Infinite Scroll
Infinite Scroll
3D Scroll
3D Scroll
Interactive Butterfly
Interactive Butterfly
Ticker Effect
Ticker Effect
Night Toggle
Night Toggle
Toast Alert
Toast Alert
Orbit Motion
Orbit Motion
Blur Orbit
Blur Orbit
Star Orbit
Star Orbit
Page Flip
Page Flip
Particle Effect
Particle Effect
GitHub Spark
GitHub Spark
Progress Set 1
Progress Set 1
Progress Set 2
Progress Set 2
Tree Rotation
Tree Rotation
Reveal Effect
Reveal Effect
Scroll Progress
Scroll Progress
Shimmer Button
Shimmer Button
Shining Card
Shining Card
Shader Demo
Shader Demo
Sphere Loader
Sphere Loader
Door Reveal
Door Reveal
Square Loader
Square Loader
Stacked Cards
Stacked Cards
Expandable Stack
Expandable Stack
Text Morph
Text Morph
Path Text
Path Text
Text Spring
Text Spring

Quick Start

  1. Clone this repository
  2. Run flutter pub get
  3. Open the project in your preferred IDE
  4. Run the app on your device or simulator

Documentation

For detailed implementation guides and API references, visit flutterfx.com/docs

Contributing

Found a bug? Have a suggestion? Feel free to open a PR with your improvements!

License

This project is licensed under the MIT License. See the LICENSE file for details.

flutterfx.com

Categories

Source repository

Projects using this package

No data available yet.