diff --git a/Frontend/patient_manager/lib/components/addOrViewPatient.dart b/Frontend/patient_manager/lib/components/addOrViewPatient.dart
index 24cbbe3c..02aff5cf 100644
--- a/Frontend/patient_manager/lib/components/addOrViewPatient.dart
+++ b/Frontend/patient_manager/lib/components/addOrViewPatient.dart
@@ -1,6 +1,7 @@
 import 'dart:convert';
 
 import 'package:flutter/material.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/env/env.dart';
 import 'package:patient_manager/objects/arguments.dart';
 import 'package:patient_manager/objects/patients.dart';
@@ -49,7 +50,7 @@ class _AddOrViewPatientState extends State<AddOrViewPatient> {
       future: fetchPatient(),
       builder: (ctx, snapshot) {
         if (snapshot.connectionState == ConnectionState.waiting) {
-          return const Center(child: CircularProgressIndicator());
+          return const Mihloadingcircle();
         }
         // Checking if future is resolved
         else if (snapshot.connectionState == ConnectionState.done) {
diff --git a/Frontend/patient_manager/lib/components/homeTileGrid.dart b/Frontend/patient_manager/lib/components/homeTileGrid.dart
index f65f8dbf..bea12b79 100644
--- a/Frontend/patient_manager/lib/components/homeTileGrid.dart
+++ b/Frontend/patient_manager/lib/components/homeTileGrid.dart
@@ -4,6 +4,7 @@ import 'package:patient_manager/components/homeTile.dart';
 import 'package:patient_manager/components/mihAppBar.dart';
 import 'package:patient_manager/components/mihAppDrawer.dart';
 import 'package:patient_manager/components/mihDeleteMessage.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/mySuccessMessage.dart';
 import 'package:patient_manager/env/env.dart';
@@ -154,6 +155,20 @@ class _HomeTileGridState extends State<HomeTileGrid> {
 
   void setAppsDev(List<List<dynamic>> tileList) {
     if (AppEnviroment.getEnv() == "Dev") {
+      tileList.add(
+        [
+          Icons.change_circle,
+          "Loading - Dev",
+          () {
+            showDialog(
+              context: context,
+              builder: (context) {
+                return const Mihloadingcircle();
+              },
+            );
+          }
+        ],
+      );
       tileList.add(
         [
           Icons.add_business_outlined,
@@ -312,7 +327,7 @@ class _HomeTileGridState extends State<HomeTileGrid> {
       appBar: const MIHAppBar(barTitle: "Mzansi Innovation Hub"),
       drawer: MIHAppDrawer(
         signedInUser: widget.signedInUser,
-        logo: MzanziInnovationHub.of(context)!.theme.logoImage(), //logo,
+        //logo: MzanziInnovationHub.of(context)!.theme.logoImage(), //logo,
       ),
       body: FutureBuilder(
         future: pbswitch,
@@ -337,9 +352,7 @@ class _HomeTileGridState extends State<HomeTileGrid> {
               ),
             );
           }
-          return const Center(
-            child: CircularProgressIndicator(),
-          );
+          return const Mihloadingcircle();
         },
       ),
       bottomNavigationBar: Visibility(
@@ -380,11 +393,5 @@ class _HomeTileGridState extends State<HomeTileGrid> {
         ),
       ),
     );
-    //     }
-    //     return const Center(
-    //       child: CircularProgressIndicator(),
-    //     );
-    //   },
-    // );
   }
 }
diff --git a/Frontend/patient_manager/lib/components/medicineSearch.dart b/Frontend/patient_manager/lib/components/medicineSearch.dart
index eb5f5339..a771af81 100644
--- a/Frontend/patient_manager/lib/components/medicineSearch.dart
+++ b/Frontend/patient_manager/lib/components/medicineSearch.dart
@@ -2,6 +2,7 @@ import 'dart:convert';
 
 import 'package:flutter/material.dart';
 import 'package:patient_manager/components/buildMedList.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/env/env.dart';
 import 'package:patient_manager/main.dart';
@@ -96,9 +97,7 @@ class _MedicineSearchState extends State<MedicineSearch> {
                     if (snapshot.connectionState == ConnectionState.waiting) {
                       return const SizedBox(
                         height: 400,
-                        child: const Center(
-                          child: CircularProgressIndicator(),
-                        ),
+                        child: Mihloadingcircle(),
                       );
                     } else if (snapshot.hasData && snapshot.data!.isNotEmpty) {
                       final medsList = snapshot.data!;
diff --git a/Frontend/patient_manager/lib/components/mihAppDrawer.dart b/Frontend/patient_manager/lib/components/mihAppDrawer.dart
index 3b0a974c..8f562ae6 100644
--- a/Frontend/patient_manager/lib/components/mihAppDrawer.dart
+++ b/Frontend/patient_manager/lib/components/mihAppDrawer.dart
@@ -5,11 +5,11 @@ import 'package:supertokens_flutter/supertokens.dart';
 
 class MIHAppDrawer extends StatefulWidget {
   final AppUser signedInUser;
-  final AssetImage logo;
+  //final AssetImage logo;
   const MIHAppDrawer({
     super.key,
     required this.signedInUser,
-    required this.logo,
+    //required this.logo,
   });
 
   @override
@@ -56,6 +56,7 @@ class _MIHAppDrawerState extends State<MIHAppDrawer> {
   Widget build(BuildContext context) {
     // precacheImage(
     //     MzanziInnovationHub.of(context)!.theme.logoImage().image, context);
+    ImageProvider logo = MzanziInnovationHub.of(context)!.theme.logoImage();
     return Drawer(
       //backgroundColor:  MzanziInnovationHub.of(context)!.theme.primaryColor(),
       child: Stack(children: [
@@ -74,7 +75,7 @@ class _MIHAppDrawerState extends State<MIHAppDrawer> {
                   children: [
                     SizedBox(
                       height: 60,
-                      child: Image(image: widget.logo),
+                      child: Image(image: logo),
                     ),
                     Text(
                       "${widget.signedInUser.fname} ${widget.signedInUser.lname}",
diff --git a/Frontend/patient_manager/lib/components/mihLoadingCircle.dart b/Frontend/patient_manager/lib/components/mihLoadingCircle.dart
new file mode 100644
index 00000000..ac0c3e99
--- /dev/null
+++ b/Frontend/patient_manager/lib/components/mihLoadingCircle.dart
@@ -0,0 +1,67 @@
+import 'package:flutter/material.dart';
+import 'package:patient_manager/main.dart';
+import 'package:gif/gif.dart';
+
+class Mihloadingcircle extends StatefulWidget {
+  const Mihloadingcircle({super.key});
+
+  @override
+  State<Mihloadingcircle> createState() => _MihloadingcircleState();
+}
+
+class _MihloadingcircleState extends State<Mihloadingcircle>
+    with TickerProviderStateMixin {
+  late final GifController _controller;
+
+  @override
+  void initState() {
+    _controller = GifController(vsync: this);
+    //_controller.animateTo(26);
+    super.initState();
+  }
+
+  @override
+  void dispose() {
+    _controller.dispose();
+    super.dispose();
+  }
+
+  @override
+  Widget build(BuildContext context) {
+    ImageProvider loading =
+        MzanziInnovationHub.of(context)!.theme.loadingImage();
+    return Dialog(
+      child: Container(
+        padding: const EdgeInsets.all(10.0),
+        width: 250,
+        height: 250,
+        decoration: BoxDecoration(
+          color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+          borderRadius: BorderRadius.circular(25.0),
+          border: Border.all(
+              color: MzanziInnovationHub.of(context)!.theme.primaryColor(),
+              width: 5.0),
+        ),
+        child: Gif(
+          image: loading,
+          controller:
+              _controller, // if duration and fps is null, original gif fps will be used.
+          fps: 15,
+          //duration: const Duration(seconds: 3),
+          autostart: Autostart.loop,
+          placeholder: (context) => const Center(
+            child: CircularProgressIndicator(),
+          ),
+          onFetchCompleted: () {
+            _controller.reset();
+            _controller.forward();
+          },
+        ),
+      ),
+
+      //   Center(
+      //       child: MzanziInnovationHub.of(context)!.theme.loadingImage()),
+      // ),
+    );
+  }
+}
diff --git a/Frontend/patient_manager/lib/components/patientFiles.dart b/Frontend/patient_manager/lib/components/patientFiles.dart
index 002d5afc..1dbc5189 100644
--- a/Frontend/patient_manager/lib/components/patientFiles.dart
+++ b/Frontend/patient_manager/lib/components/patientFiles.dart
@@ -5,6 +5,7 @@ import 'package:file_picker/file_picker.dart';
 import 'package:flutter/material.dart';
 import 'package:patient_manager/components/buildFilesList.dart';
 import 'package:patient_manager/components/medCertInput.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/mySuccessMessage.dart';
 import 'package:patient_manager/components/myTextInput.dart';
@@ -68,9 +69,7 @@ class _PatientFilesState extends State<PatientFiles> {
     showDialog(
       context: context,
       builder: (context) {
-        return const Center(
-          child: CircularProgressIndicator(),
-        );
+        return const Mihloadingcircle();
       },
     );
 
@@ -130,9 +129,7 @@ class _PatientFilesState extends State<PatientFiles> {
     showDialog(
       context: context,
       builder: (context) {
-        return const Center(
-          child: CircularProgressIndicator(),
-        );
+        return const Mihloadingcircle();
       },
     );
 
@@ -640,9 +637,7 @@ class _PatientFilesState extends State<PatientFiles> {
       future: futueFiles,
       builder: (context, snapshot) {
         if (snapshot.connectionState == ConnectionState.waiting) {
-          return const Center(
-            child: CircularProgressIndicator(),
-          );
+          return const Mihloadingcircle();
         } else if (snapshot.hasData) {
           final filesList = snapshot.data!;
           return Container(
diff --git a/Frontend/patient_manager/lib/components/patientNotes.dart b/Frontend/patient_manager/lib/components/patientNotes.dart
index cf49d3ad..ae6a3fca 100644
--- a/Frontend/patient_manager/lib/components/patientNotes.dart
+++ b/Frontend/patient_manager/lib/components/patientNotes.dart
@@ -2,6 +2,7 @@ import 'dart:convert';
 
 import 'package:flutter/material.dart';
 import 'package:patient_manager/components/buildNotesList.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/myMLTextInput.dart';
 import 'package:patient_manager/components/mySuccessMessage.dart';
@@ -266,9 +267,7 @@ class _PatientNotesState extends State<PatientNotes> {
       future: futueNotes,
       builder: (context, snapshot) {
         if (snapshot.connectionState == ConnectionState.waiting) {
-          return const Center(
-            child: CircularProgressIndicator(),
-          );
+          return const Mihloadingcircle();
         } else if (snapshot.hasData) {
           final notesList = snapshot.data!;
           return Container(
diff --git a/Frontend/patient_manager/lib/main.dart b/Frontend/patient_manager/lib/main.dart
index 94ac4af4..d79f27e4 100644
--- a/Frontend/patient_manager/lib/main.dart
+++ b/Frontend/patient_manager/lib/main.dart
@@ -57,7 +57,8 @@ class _MzanziInnovationHubState extends State<MzanziInnovationHub> {
 
   @override
   Widget build(BuildContext context) {
-    //precacheImage(theme.logoImage(), context);
+    precacheImage(theme.loadingImage(), context);
+    precacheImage(theme.logoImage(), context);
     return MaterialApp(
       title: getTitle(),
       themeMode: _themeMode,
diff --git a/Frontend/patient_manager/lib/pages/home.dart b/Frontend/patient_manager/lib/pages/home.dart
index 86751a23..0a9823f5 100644
--- a/Frontend/patient_manager/lib/pages/home.dart
+++ b/Frontend/patient_manager/lib/pages/home.dart
@@ -1,6 +1,7 @@
 import 'dart:convert';
 
 import 'package:flutter/material.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/env/env.dart';
 import 'package:patient_manager/components/homeTileGrid.dart';
 import 'package:patient_manager/objects/appUser.dart';
@@ -97,9 +98,7 @@ class _HomeState extends State<Home> {
             );
           }
         }
-        return const Center(
-          child: CircularProgressIndicator(),
-        );
+        return const Mihloadingcircle();
       },
     );
   }
diff --git a/Frontend/patient_manager/lib/pages/patientManager.dart b/Frontend/patient_manager/lib/pages/patientManager.dart
index 9d51d2e4..15f24d14 100644
--- a/Frontend/patient_manager/lib/pages/patientManager.dart
+++ b/Frontend/patient_manager/lib/pages/patientManager.dart
@@ -5,6 +5,7 @@ import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:patient_manager/components/buildPatientList.dart';
 import 'package:patient_manager/components/mihAppBar.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/objects/appUser.dart';
 import 'package:supertokens_flutter/http.dart' as http;
 import 'package:patient_manager/components/mySearchInput.dart';
@@ -171,9 +172,7 @@ class _PatientManagerState extends State<PatientManager> {
                               .secondaryColor(),
                           width: 3.0),
                     ),
-                    child: const Center(
-                      child: CircularProgressIndicator(),
-                    ),
+                    child: const Mihloadingcircle(),
                   );
                 } else if (snapshot.connectionState == ConnectionState.done &&
                     snapshot.hasData) {
diff --git a/Frontend/patient_manager/lib/pages/patientView.dart b/Frontend/patient_manager/lib/pages/patientView.dart
index 6825de1f..3ebaebb9 100644
--- a/Frontend/patient_manager/lib/pages/patientView.dart
+++ b/Frontend/patient_manager/lib/pages/patientView.dart
@@ -1,6 +1,7 @@
 import 'dart:convert';
 
 import 'package:flutter/material.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/patientDetails.dart';
 import 'package:patient_manager/components/mihAppBar.dart';
 import 'package:patient_manager/components/patientFiles.dart';
@@ -64,7 +65,7 @@ class _PatientViewState extends State<PatientView> {
       future: fetchPatient(),
       builder: (ctx, snapshot) {
         if (snapshot.connectionState == ConnectionState.waiting) {
-          return const Center(child: CircularProgressIndicator());
+          return const Mihloadingcircle();
         }
         // Checking if future is resolved
         else if (snapshot.connectionState == ConnectionState.done) {
diff --git a/Frontend/patient_manager/lib/pages/profileBusinessAdd.dart b/Frontend/patient_manager/lib/pages/profileBusinessAdd.dart
index 5b37a9bd..4bb38d79 100644
--- a/Frontend/patient_manager/lib/pages/profileBusinessAdd.dart
+++ b/Frontend/patient_manager/lib/pages/profileBusinessAdd.dart
@@ -3,6 +3,7 @@ import 'dart:convert';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:patient_manager/components/mihAppBar.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myDropdownInput.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/myFileInput.dart';
@@ -96,11 +97,10 @@ class _ProfileBusinessAddState extends State<ProfileBusinessAdd> {
     showDialog(
       context: context,
       builder: (context) {
-        return const Center(
-          child: CircularProgressIndicator(),
-        );
+        return const Mihloadingcircle();
       },
     );
+
     var response = await http.post(
       Uri.parse("$baseAPI/business/insert/"),
       headers: <String, String>{
diff --git a/Frontend/patient_manager/lib/pages/profileBusinessUpdate.dart b/Frontend/patient_manager/lib/pages/profileBusinessUpdate.dart
index 56290278..82d11624 100644
--- a/Frontend/patient_manager/lib/pages/profileBusinessUpdate.dart
+++ b/Frontend/patient_manager/lib/pages/profileBusinessUpdate.dart
@@ -4,6 +4,7 @@ import 'package:file_picker/file_picker.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 import 'package:patient_manager/components/mihAppBar.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myDropdownInput.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/myFileInput.dart';
@@ -159,11 +160,10 @@ class _ProfileBusinessUpdateState extends State<ProfileBusinessUpdate> {
     showDialog(
       context: context,
       builder: (context) {
-        return const Center(
-          child: CircularProgressIndicator(),
-        );
+        return const Mihloadingcircle();
       },
     );
+
     var response = await http.put(
       Uri.parse("$baseAPI/business/update/"),
       headers: <String, String>{
diff --git a/Frontend/patient_manager/lib/pages/register.dart b/Frontend/patient_manager/lib/pages/register.dart
index 63b63129..3d4a7f07 100644
--- a/Frontend/patient_manager/lib/pages/register.dart
+++ b/Frontend/patient_manager/lib/pages/register.dart
@@ -2,6 +2,7 @@ import 'dart:convert';
 
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/myPassInput.dart';
 import 'package:patient_manager/components/mySuccessMessage.dart';
@@ -65,19 +66,15 @@ class _RegisterState extends State<Register> {
     } else if (passwordController.text != confirmPasswordController.text) {
       passwordError();
     } else {
-      var _backgroundColor = Colors.transparent;
+      //var _backgroundColor = Colors.transparent;
 
       showDialog(
         context: context,
-        barrierColor: _backgroundColor,
-        builder: (BuildContext dialogContext) {
-          return AlertDialog(
-              backgroundColor: _backgroundColor,
-              content: const Center(
-                child: CircularProgressIndicator(),
-              ));
+        builder: (context) {
+          return const Mihloadingcircle();
         },
       );
+
       try {
         Uri uri = Uri.parse(
             "$baseAPI/auth/emailpassword/email/exists?email=${emailController.text}");
diff --git a/Frontend/patient_manager/lib/pages/signin.dart b/Frontend/patient_manager/lib/pages/signin.dart
index 734f52c9..7b5ff8ac 100644
--- a/Frontend/patient_manager/lib/pages/signin.dart
+++ b/Frontend/patient_manager/lib/pages/signin.dart
@@ -2,6 +2,7 @@ import 'dart:convert';
 
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
+import 'package:patient_manager/components/mihLoadingCircle.dart';
 import 'package:patient_manager/components/myErrorMessage.dart';
 import 'package:patient_manager/components/myPassInput.dart';
 import 'package:patient_manager/components/myTextInput.dart';
@@ -31,23 +32,15 @@ class _SignInState extends State<SignIn> {
 
   //sign user in
   Future<void> signUserIn() async {
-    var _backgroundColor = Colors.transparent;
+    //var _backgroundColor = Colors.transparent;
 
     showDialog(
       context: context,
-      barrierColor: _backgroundColor,
-      builder: (BuildContext dialogContext) {
-        return AlertDialog(
-          backgroundColor: _backgroundColor,
-          content: Container(
-            child: const Center(
-              child:
-                  CircularProgressIndicator(), // Put your gif into the assets folder
-            ),
-          ),
-        );
+      builder: (context) {
+        return const Mihloadingcircle();
       },
     );
+
     try {
       var response = await http.post(
         Uri.parse("$baseAPI/auth/signin"),
diff --git a/Frontend/patient_manager/lib/theme/mihTheme.dart b/Frontend/patient_manager/lib/theme/mihTheme.dart
index a2df8721..631d9f74 100644
--- a/Frontend/patient_manager/lib/theme/mihTheme.dart
+++ b/Frontend/patient_manager/lib/theme/mihTheme.dart
@@ -7,7 +7,7 @@ class MyTheme {
   late int _succColor;
   late int _mesColor;
   late String mode;
-  late Image loading;
+  late AssetImage loading;
 
   // Options:-
   // f3f9d2 = Cream
@@ -115,16 +115,14 @@ class MyTheme {
     }
   }
 
-  Image loadingImage() {
+  AssetImage loadingImage() {
     if (mode == "Dark") {
-      loading = Image.asset(
+      loading = const AssetImage(
         'images/loading2.gif',
-        width: 100,
       );
     } else {
-      loading = Image.asset(
+      loading = const AssetImage(
         'images/loading1.gif',
-        width: 100,
       );
     }
     return loading;
diff --git a/Frontend/patient_manager/pubspec.lock b/Frontend/patient_manager/pubspec.lock
index 30b742ca..5b57a606 100644
--- a/Frontend/patient_manager/pubspec.lock
+++ b/Frontend/patient_manager/pubspec.lock
@@ -408,6 +408,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "2.2.0"
+  gif:
+    dependency: "direct main"
+    description:
+      name: gif
+      sha256: ade95694f1471da737922806818ffade2814d1d7f8d10af38ebcf36ace012bc0
+      url: "https://pub.dev"
+    source: hosted
+    version: "2.3.0"
   glob:
     dependency: transitive
     description:
diff --git a/Frontend/patient_manager/pubspec.yaml b/Frontend/patient_manager/pubspec.yaml
index 83985dfd..23a6dddc 100644
--- a/Frontend/patient_manager/pubspec.yaml
+++ b/Frontend/patient_manager/pubspec.yaml
@@ -45,6 +45,7 @@ dependencies:
   google_nav_bar: ^5.0.6
   mysql_client: ^0.0.27
   args: 2.5.0
+  gif: ^2.3.0
 
 dev_dependencies:
   flutter_test: