diff --git a/lib/main.dart b/lib/main.dart
index 40d6a2c3..8b8b789a 100644
--- a/lib/main.dart
+++ b/lib/main.dart
@@ -68,7 +68,9 @@ class Navigation extends StatelessWidget {
           selectedIndex: model.currentIndex,
           destinations: <Widget>[
             NavigationDestination(
-              icon: const Icon(Icons.dashboard),
+              icon: const Icon(
+                Icons.dashboard,
+              ),
               label: FlutterI18n.translate(
                 context,
                 'main.dashboardTab',
diff --git a/lib/ui/views/app_selector/app_selector_view.dart b/lib/ui/views/app_selector/app_selector_view.dart
index 99389a65..5c99b555 100644
--- a/lib/ui/views/app_selector/app_selector_view.dart
+++ b/lib/ui/views/app_selector/app_selector_view.dart
@@ -5,6 +5,7 @@ import 'package:revanced_manager/ui/widgets/installed_app_item.dart';
 import 'package:revanced_manager/ui/widgets/search_bar.dart';
 import 'package:stacked/stacked.dart';
 import 'package:revanced_manager/ui/views/app_selector/app_selector_viewmodel.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 class AppSelectorView extends StatefulWidget {
   const AppSelectorView({Key? key}) : super(key: key);
@@ -18,6 +19,7 @@ class _AppSelectorViewState extends State<AppSelectorView> {
 
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return ViewModelBuilder<AppSelectorViewModel>.reactive(
       disposeViewModel: false,
       onModelReady: (model) => model.initialise(),
@@ -31,10 +33,13 @@ class _AppSelectorViewState extends State<AppSelectorView> {
                 ? Column(
                     children: [
                       SearchBar(
+                        fillColor:
+                            isDark ? Colors.blueGrey[700] : Colors.grey[400],
                         hintText: FlutterI18n.translate(
                           context,
                           'appSelectorView.searchBarHint',
                         ),
+                        hintTextColor: isDark ? Colors.white : Colors.grey[800],
                         onQueryChanged: (searchQuery) {
                           setState(() {
                             query = searchQuery;
diff --git a/lib/ui/views/home/home_view.dart b/lib/ui/views/home/home_view.dart
index 3ac2eb73..3810da42 100644
--- a/lib/ui/views/home/home_view.dart
+++ b/lib/ui/views/home/home_view.dart
@@ -13,6 +13,7 @@ class HomeView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return ViewModelBuilder.reactive(
       viewModelBuilder: () => HomeViewModel(),
       builder: (context, model, child) => Scaffold(
@@ -53,7 +54,9 @@ class HomeView extends StatelessWidget {
                     ),
                   ),
                   const SizedBox(height: 10),
-                  const LatestCommitCard(),
+                  LatestCommitCard(
+                    color: isDark ? const Color(0xff1B222B) : Colors.grey[350],
+                  ),
                   const SizedBox(height: 14),
                   I18nText(
                     'homeView.patchedSubtitle',
@@ -65,9 +68,13 @@ class HomeView extends StatelessWidget {
                     ),
                   ),
                   const SizedBox(height: 14),
-                  const AvailableUpdatesCard(),
+                  AvailableUpdatesCard(
+                    color: isDark ? const Color(0xff1B222B) : Colors.grey[350],
+                  ),
                   const SizedBox(height: 15),
-                  const InstalledAppsCard(),
+                  InstalledAppsCard(
+                    color: isDark ? const Color(0xff1B222B) : Colors.grey[350],
+                  ),
                 ],
               ),
             ),
diff --git a/lib/ui/views/patcher/patcher_view.dart b/lib/ui/views/patcher/patcher_view.dart
index b41c50c0..1c99d3c7 100644
--- a/lib/ui/views/patcher/patcher_view.dart
+++ b/lib/ui/views/patcher/patcher_view.dart
@@ -5,6 +5,7 @@ import 'package:revanced_manager/app/app.locator.dart';
 import 'package:revanced_manager/ui/widgets/app_selector_card.dart';
 import 'package:revanced_manager/ui/widgets/patch_selector_card.dart';
 import 'package:stacked/stacked.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 import 'patcher_viewmodel.dart';
 
@@ -13,6 +14,7 @@ class PatcherView extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return ViewModelBuilder<PatcherViewModel>.reactive(
       disposeViewModel: false,
       viewModelBuilder: () => locator<PatcherViewModel>(),
@@ -47,12 +49,16 @@ class PatcherView extends StatelessWidget {
                 const SizedBox(height: 23),
                 AppSelectorCard(
                   onPressed: model.navigateToAppSelector,
+                  color: isDark ? const Color(0xff1B222B) : Colors.grey[350],
                 ),
                 const SizedBox(height: 16),
                 Opacity(
-                  opacity: model.dimPatchCard ? 0.5 : 1,
+                  opacity: isDark
+                      ? (model.dimPatchCard ? 0.5 : 1)
+                      : (model.dimPatchCard ? 0.75 : 1),
                   child: PatchSelectorCard(
                     onPressed: model.navigateToPatchesSelector,
+                    color: isDark ? const Color(0xff1B222B) : Colors.grey[350],
                   ),
                 ),
               ],
diff --git a/lib/ui/views/patches_selector/patches_selector_view.dart b/lib/ui/views/patches_selector/patches_selector_view.dart
index 36f8a0b3..f8bb5a56 100644
--- a/lib/ui/views/patches_selector/patches_selector_view.dart
+++ b/lib/ui/views/patches_selector/patches_selector_view.dart
@@ -5,6 +5,7 @@ import 'package:revanced_manager/ui/views/patches_selector/patches_selector_view
 import 'package:revanced_manager/ui/widgets/patch_item.dart';
 import 'package:revanced_manager/ui/widgets/search_bar.dart';
 import 'package:stacked/stacked.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 class PatchesSelectorView extends StatefulWidget {
   const PatchesSelectorView({Key? key}) : super(key: key);
@@ -19,6 +20,7 @@ class _PatchesSelectorViewState extends State<PatchesSelectorView> {
 
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return ViewModelBuilder<PatchesSelectorViewModel>.reactive(
       disposeViewModel: false,
       onModelReady: (model) => model.initialise(),
@@ -32,10 +34,13 @@ class _PatchesSelectorViewState extends State<PatchesSelectorView> {
                 ? Column(
                     children: [
                       SearchBar(
+                        fillColor:
+                            isDark ? Colors.blueGrey[700] : Colors.grey[400],
                         hintText: FlutterI18n.translate(
                           context,
                           'patchesSelectorView.searchBarHint',
                         ),
+                        hintTextColor: isDark ? Colors.white : Colors.grey[800],
                         onQueryChanged: (searchQuery) {
                           setState(() {
                             query = searchQuery;
diff --git a/lib/ui/widgets/app_selector_card.dart b/lib/ui/widgets/app_selector_card.dart
index 1a023e31..4cae7a40 100644
--- a/lib/ui/widgets/app_selector_card.dart
+++ b/lib/ui/widgets/app_selector_card.dart
@@ -8,9 +8,12 @@ import 'package:revanced_manager/ui/views/app_selector/app_selector_viewmodel.da
 
 class AppSelectorCard extends StatelessWidget {
   final Function()? onPressed;
+  final Color? color;
+
   AppSelectorCard({
     Key? key,
     this.onPressed,
+    this.color = const Color(0xff1B222B),
   }) : super(key: key);
 
   final PatcherAPI patcherAPI = locator<PatcherAPI>();
@@ -23,7 +26,7 @@ class AppSelectorCard extends StatelessWidget {
         width: double.infinity,
         decoration: BoxDecoration(
           borderRadius: BorderRadius.circular(12),
-          color: const Color(0xff1B222B),
+          color: color,
         ),
         padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20),
         child: Column(
diff --git a/lib/ui/widgets/available_updates_card.dart b/lib/ui/widgets/available_updates_card.dart
index a7a44f86..3f0201b2 100644
--- a/lib/ui/widgets/available_updates_card.dart
+++ b/lib/ui/widgets/available_updates_card.dart
@@ -3,16 +3,22 @@ import 'package:flutter_i18n/flutter_i18n.dart';
 import 'package:google_fonts/google_fonts.dart';
 import 'package:revanced_manager/ui/widgets/application_item.dart';
 import 'package:revanced_manager/ui/widgets/patch_text_button.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 class AvailableUpdatesCard extends StatelessWidget {
-  const AvailableUpdatesCard({Key? key}) : super(key: key);
+  final Color? color;
+  const AvailableUpdatesCard({
+    Key? key,
+    this.color = const Color(0xff1B222B),
+  }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return Container(
       decoration: BoxDecoration(
         borderRadius: BorderRadius.circular(12),
-        color: const Color(0xff1B222B),
+        color: color,
       ),
       padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20),
       child: Column(
diff --git a/lib/ui/widgets/installed_app_item.dart b/lib/ui/widgets/installed_app_item.dart
index e33b474b..1787d704 100644
--- a/lib/ui/widgets/installed_app_item.dart
+++ b/lib/ui/widgets/installed_app_item.dart
@@ -3,6 +3,7 @@ import 'dart:typed_data';
 import 'package:flutter/material.dart';
 import 'package:google_fonts/google_fonts.dart';
 import 'package:revanced_manager/constants.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 class InstalledAppItem extends StatefulWidget {
   final String name;
@@ -23,13 +24,14 @@ class InstalledAppItem extends StatefulWidget {
 class _InstalledAppItemState extends State<InstalledAppItem> {
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return Padding(
       padding: const EdgeInsets.symmetric(vertical: 4.0),
       child: Container(
         padding: const EdgeInsets.all(12.0),
         decoration: BoxDecoration(
           borderRadius: BorderRadius.circular(12),
-          color: const Color(0xff1B222B),
+          color: isDark ? const Color(0xff1B222B) : Colors.grey[350],
         ),
         child: Row(
           mainAxisAlignment: MainAxisAlignment.spaceBetween,
diff --git a/lib/ui/widgets/installed_apps_card.dart b/lib/ui/widgets/installed_apps_card.dart
index 6b75751c..3a744341 100644
--- a/lib/ui/widgets/installed_apps_card.dart
+++ b/lib/ui/widgets/installed_apps_card.dart
@@ -4,14 +4,18 @@ import 'package:google_fonts/google_fonts.dart';
 import 'package:revanced_manager/ui/widgets/application_item.dart';
 
 class InstalledAppsCard extends StatelessWidget {
-  const InstalledAppsCard({Key? key}) : super(key: key);
+  final Color? color;
+  const InstalledAppsCard({
+    Key? key,
+    this.color = const Color(0xff1B222B),
+  }) : super(key: key);
 
   @override
   Widget build(BuildContext context) {
     return Container(
       decoration: BoxDecoration(
         borderRadius: BorderRadius.circular(12),
-        color: const Color(0xff1B222B),
+        color: color,
       ),
       padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20),
       child: Column(
diff --git a/lib/ui/widgets/latest_commit_card.dart b/lib/ui/widgets/latest_commit_card.dart
index 30645adc..4b8dea1f 100644
--- a/lib/ui/widgets/latest_commit_card.dart
+++ b/lib/ui/widgets/latest_commit_card.dart
@@ -6,7 +6,11 @@ import 'package:revanced_manager/constants.dart';
 import 'package:revanced_manager/ui/widgets/patch_text_button.dart';
 
 class LatestCommitCard extends StatefulWidget {
-  const LatestCommitCard({Key? key}) : super(key: key);
+  final Color? color;
+  const LatestCommitCard({
+    Key? key,
+    this.color = const Color(0xff1B222B),
+  }) : super(key: key);
 
   @override
   State<LatestCommitCard> createState() => _LatestCommitCardState();
@@ -20,7 +24,7 @@ class _LatestCommitCardState extends State<LatestCommitCard> {
     return Container(
       decoration: BoxDecoration(
         borderRadius: BorderRadius.circular(12),
-        color: const Color(0xff1B222B),
+        color: widget.color,
       ),
       padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20),
       child: Row(
diff --git a/lib/ui/widgets/patch_item.dart b/lib/ui/widgets/patch_item.dart
index ee51148b..6fce9a2f 100644
--- a/lib/ui/widgets/patch_item.dart
+++ b/lib/ui/widgets/patch_item.dart
@@ -1,5 +1,6 @@
 import 'package:flutter/material.dart';
 import 'package:google_fonts/google_fonts.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 // ignore: must_be_immutable
 class PatchItem extends StatefulWidget {
@@ -25,9 +26,10 @@ class PatchItem extends StatefulWidget {
 class _PatchItemState extends State<PatchItem> {
   @override
   Widget build(BuildContext context) {
+    bool isDark = getThemeManager(context).isDarkMode;
     return Container(
       decoration: BoxDecoration(
-        color: const Color(0xff1B222B),
+        color: isDark ? const Color(0xff1B222B) : Colors.grey[300],
         borderRadius: BorderRadius.circular(10),
       ),
       padding: const EdgeInsets.symmetric(vertical: 12, horizontal: 12),
diff --git a/lib/ui/widgets/patch_selector_card.dart b/lib/ui/widgets/patch_selector_card.dart
index e6d234fd..10229484 100644
--- a/lib/ui/widgets/patch_selector_card.dart
+++ b/lib/ui/widgets/patch_selector_card.dart
@@ -5,12 +5,16 @@ import 'package:revanced_manager/app/app.locator.dart';
 import 'package:revanced_manager/constants.dart';
 import 'package:revanced_manager/ui/views/app_selector/app_selector_viewmodel.dart';
 import 'package:revanced_manager/ui/views/patches_selector/patches_selector_viewmodel.dart';
+import 'package:stacked_themes/stacked_themes.dart';
 
 class PatchSelectorCard extends StatelessWidget {
   final Function()? onPressed;
+  final Color? color;
+
   const PatchSelectorCard({
     Key? key,
     this.onPressed,
+    this.color = const Color(0xff1B222B),
   }) : super(key: key);
 
   @override
@@ -21,7 +25,7 @@ class PatchSelectorCard extends StatelessWidget {
         width: double.infinity,
         decoration: BoxDecoration(
           borderRadius: BorderRadius.circular(12),
-          color: const Color(0xff1B222B),
+          color: color,
         ),
         padding: const EdgeInsets.symmetric(vertical: 18, horizontal: 20),
         child: Column(
diff --git a/lib/ui/widgets/search_bar.dart b/lib/ui/widgets/search_bar.dart
index 68959d7c..021d27c0 100644
--- a/lib/ui/widgets/search_bar.dart
+++ b/lib/ui/widgets/search_bar.dart
@@ -4,12 +4,14 @@ import 'package:google_fonts/google_fonts.dart';
 class SearchBar extends StatefulWidget {
   final String? hintText;
   final Color? backgroundColor;
+  final Color? fillColor;
   final Color? hintTextColor;
 
   const SearchBar({
     required this.hintText,
     this.backgroundColor = const Color(0xff1B222B),
     this.hintTextColor = Colors.white,
+    required this.fillColor,
     Key? key,
     required this.onQueryChanged,
   }) : super(key: key);
@@ -40,7 +42,7 @@ class _SearchBarState extends State<SearchBar> {
             child: TextField(
               onChanged: widget.onQueryChanged,
               decoration: InputDecoration(
-                fillColor: Colors.blueGrey[700],
+                fillColor: widget.fillColor,
                 filled: true,
                 contentPadding: const EdgeInsets.all(12.0),
                 hintText: widget.hintText,
@@ -50,7 +52,6 @@ class _SearchBarState extends State<SearchBar> {
                 ),
                 prefixIcon: const Icon(
                   Icons.search,
-                  color: Colors.white,
                   size: 24.0,
                 ),
                 border: OutlineInputBorder(