diff --git a/lib/pages/analytics/modules/air_quality/widgets/aqi_sub_value_widget.dart b/lib/pages/analytics/modules/air_quality/widgets/aqi_sub_value_widget.dart
index c4ed3b15..b23a32d8 100644
--- a/lib/pages/analytics/modules/air_quality/widgets/aqi_sub_value_widget.dart
+++ b/lib/pages/analytics/modules/air_quality/widgets/aqi_sub_value_widget.dart
@@ -3,27 +3,24 @@ import 'package:syncrow_web/utils/color_manager.dart';
 import 'package:syncrow_web/utils/extension/build_context_x.dart';
 
 final class _AqiRange {
-  const _AqiRange({
-    required this.max,
-    required this.color,
-  });
+  const _AqiRange({required this.max, required this.color});
 
   final int max;
   final Color color;
 }
 
 class AqiSubValueWidget extends StatelessWidget {
-  final String label;
-  final int value;
-  final String unit;
-
   const AqiSubValueWidget({
-    super.key,
     required this.label,
     required this.value,
     required this.unit,
+    super.key,
   });
 
+  final String label;
+  final int value;
+  final String unit;
+
   static const List<_AqiRange> _ranges = [
     _AqiRange(max: 12, color: ColorsManager.goodGreen),
     _AqiRange(max: 35, color: ColorsManager.poorOrange),
@@ -106,7 +103,9 @@ class AqiSubValueWidget extends StatelessWidget {
                   alpha: isActive ? 1.0 : 0.25,
                 );
             return Expanded(
-              child: Container(
+              child: AnimatedContainer(
+                duration: const Duration(milliseconds: 150),
+                curve: Curves.linear,
                 height: 5,
                 decoration: BoxDecoration(
                   color: color,