diff --git a/CHANGELOG.md b/CHANGELOG.md
index 5940df7..eb34281 100644
--- a/CHANGELOG.md
+++ b/CHANGELOG.md
@@ -1,3 +1,6 @@
+## [4.3.0]
+- Fix issues with light & dark themes support
+
 ## [4.2.0]
 - Updated dependencies
 - Added AGP 8.3 support to the example
diff --git a/example/android/app/src/main/AndroidManifest.xml b/example/android/app/src/main/AndroidManifest.xml
index 8903954..d34c6da 100644
--- a/example/android/app/src/main/AndroidManifest.xml
+++ b/example/android/app/src/main/AndroidManifest.xml
@@ -10,6 +10,7 @@
             android:theme="@style/LaunchTheme"
             android:configChanges="orientation|keyboardHidden|keyboard|screenSize|smallestScreenSize|locale|layoutDirection|fontScale|screenLayout|density|uiMode"
             android:hardwareAccelerated="true"
+            android:enableOnBackInvokedCallback="true"
             android:windowSoftInputMode="adjustResize">
             <!-- Specifies an Android theme to apply to this Activity as soon as
                  the Android process has started. This theme is visible to the user
diff --git a/example/devtools_options.yaml b/example/devtools_options.yaml
new file mode 100644
index 0000000..7e7e7f6
--- /dev/null
+++ b/example/devtools_options.yaml
@@ -0,0 +1 @@
+extensions:
diff --git a/example/lib/example_app.dart b/example/lib/example_app.dart
index b36a012..d04875f 100644
--- a/example/lib/example_app.dart
+++ b/example/lib/example_app.dart
@@ -16,6 +16,7 @@ class ExampleApp extends StatelessWidget {
     return MaterialApp(
       title: 'Debug',
       navigatorKey: navigatorKey,
+      themeMode: ThemeMode.system,
       home: Container(
         decoration: const BoxDecoration(
           color: Colors.white,
@@ -25,9 +26,11 @@ class ExampleApp extends StatelessWidget {
           child: Column(
             mainAxisSize: MainAxisSize.min,
             children: <Widget>[
-              Padding(
-                padding: const EdgeInsets.symmetric(horizontal: 36),
-                child: Image.asset('assets/images/png/dash_dart.png'),
+              Flexible(
+                child: Padding(
+                  padding: const EdgeInsets.symmetric(horizontal: 36),
+                  child: Image.asset('assets/images/png/dash_dart.png'),
+                ),
               ),
               const SizedBox(height: 16),
               const ControlPanelGate(
diff --git a/example/pubspec.lock b/example/pubspec.lock
index 2f44de3..a7a8840 100644
--- a/example/pubspec.lock
+++ b/example/pubspec.lock
@@ -5,10 +5,10 @@ packages:
     dependency: "direct main"
     description:
       name: alice_lightweight
-      sha256: cef2188ab0a272aeabd4824d924d354b70d627c9c7365e6ff168578b3b266a81
+      sha256: "44eca874655081dbfe48e01392ecf66c7fb2d3e98c315e9285bb7f4888efee61"
       url: "https://pub.dev"
     source: hosted
-    version: "3.6.0"
+    version: "3.7.0"
   async:
     dependency: transitive
     description:
@@ -63,7 +63,7 @@ packages:
       path: ".."
       relative: true
     source: path
-    version: "4.2.0"
+    version: "4.3.0"
   dash_kit_lints:
     dependency: transitive
     description:
@@ -259,18 +259,18 @@ packages:
     dependency: transitive
     description:
       name: path_provider
-      sha256: b27217933eeeba8ff24845c34003b003b2b22151de3c908d0e679e8fe1aa078b
+      sha256: c9e7d3a4cd1410877472158bee69963a4579f78b68c65a2b7d40d1a7a88bb161
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.2"
+    version: "2.1.3"
   path_provider_android:
     dependency: transitive
     description:
       name: path_provider_android
-      sha256: "477184d672607c0a3bf68fbbf601805f92ef79c82b64b4d6eb318cbca4c48668"
+      sha256: a248d8146ee5983446bf03ed5ea8f6533129a12b11f12057ad1b4a67a2b3b41d
       url: "https://pub.dev"
     source: hosted
-    version: "2.2.2"
+    version: "2.2.4"
   path_provider_foundation:
     dependency: transitive
     description:
@@ -339,10 +339,10 @@ packages:
     dependency: transitive
     description:
       name: share_plus
-      sha256: "05ec043470319bfbabe0adbc90d3a84cbff0426b9d9f3a6e2ad3e131fa5fa629"
+      sha256: fb5319f3aab4c5dda5ebb92dca978179ba21f8c783ee4380910ef4c1c6824f51
       url: "https://pub.dev"
     source: hosted
-    version: "8.0.2"
+    version: "8.0.3"
   share_plus_platform_interface:
     dependency: transitive
     description:
@@ -472,10 +472,10 @@ packages:
     dependency: transitive
     description:
       name: url_launcher_web
-      sha256: "3692a459204a33e04bc94f5fb91158faf4f2c8903281ddd82915adecdb1a901d"
+      sha256: "8d9e750d8c9338601e709cd0885f95825086bd8b642547f26bda435aade95d8a"
       url: "https://pub.dev"
     source: hosted
-    version: "2.3.0"
+    version: "2.3.1"
   url_launcher_windows:
     dependency: transitive
     description:
@@ -488,10 +488,10 @@ packages:
     dependency: transitive
     description:
       name: uuid
-      sha256: cd210a09f7c18cbe5a02511718e0334de6559871052c90a90c0cca46a4aa81c8
+      sha256: "814e9e88f21a176ae1359149021870e87f7cddaf633ab678a5d2b0bff7fd1ba8"
       url: "https://pub.dev"
     source: hosted
-    version: "4.3.3"
+    version: "4.4.0"
   vector_math:
     dependency: transitive
     description:
diff --git a/example/pubspec.yaml b/example/pubspec.yaml
index 10b38d1..35c1338 100644
--- a/example/pubspec.yaml
+++ b/example/pubspec.yaml
@@ -12,7 +12,7 @@ dependencies:
   dash_kit_control_panel:
     path: ../
   dio: ^5.4.2+1
-  alice_lightweight: ^3.6.0
+  alice_lightweight: ^3.7.0
   flutter:
     sdk: flutter
 
diff --git a/lib/src/ui/components/demo/demo_setting.dart b/lib/src/ui/components/demo/demo_setting.dart
index 06ffa47..79bef41 100644
--- a/lib/src/ui/components/demo/demo_setting.dart
+++ b/lib/src/ui/components/demo/demo_setting.dart
@@ -1,6 +1,7 @@
 import 'package:dash_kit_control_panel/src/panel/control_panel_setting.dart';
 import 'package:dash_kit_control_panel/src/services/demo_mode.dart';
 import 'package:dash_kit_control_panel/src/ui/components/setting_group.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 
 class DemoSetting extends StatefulWidget implements ControlPanelSetting {
@@ -42,7 +43,7 @@ class _DemoSettingState extends State<DemoSetting> {
             Text(
               'Demo mode',
               style: TextStyle(
-                color: Colors.white.withAlpha(240),
+                color: AppColors.of(context).text,
                 fontSize: 15,
               ),
             ),
diff --git a/lib/src/ui/components/device_preview/device_preview_setting.dart b/lib/src/ui/components/device_preview/device_preview_setting.dart
index 8df750f..e90bf5b 100644
--- a/lib/src/ui/components/device_preview/device_preview_setting.dart
+++ b/lib/src/ui/components/device_preview/device_preview_setting.dart
@@ -1,4 +1,5 @@
 import 'package:dash_kit_control_panel/dash_kit_control_panel.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 
 class DevicePreviewSetting extends StatefulWidget
@@ -39,7 +40,7 @@ class _DevicePreviewSettingState extends State<DevicePreviewSetting> {
             Text(
               'Device Preview mode',
               style: TextStyle(
-                color: Colors.white.withAlpha(240),
+                color: AppColors.of(context).text,
                 fontSize: 15,
               ),
             ),
diff --git a/lib/src/ui/components/logger/log_console.dart b/lib/src/ui/components/logger/log_console.dart
index 11e5798..20d9218 100644
--- a/lib/src/ui/components/logger/log_console.dart
+++ b/lib/src/ui/components/logger/log_console.dart
@@ -8,12 +8,10 @@ import 'package:logger/logger.dart';
 // ignore_for_file: avoid-returning-widgets
 class LogConsole extends StatefulWidget {
   const LogConsole({
-    this.dark = false,
     this.showCloseButton = false,
     super.key,
   });
 
-  final bool dark;
   final bool showCloseButton;
 
   @override
@@ -84,30 +82,70 @@ class _LogConsoleState extends State<LogConsole> {
 
   @override
   Widget build(BuildContext context) {
-    final colorScheme = Theme.of(context).colorScheme;
+    final isDark = Theme.of(context).brightness == Brightness.dark;
 
     return MaterialApp(
       debugShowCheckedModeBanner: false,
-      theme: widget.dark
+      theme: isDark
           ? ThemeData(
-              brightness: Brightness.dark,
-              colorScheme: colorScheme.copyWith(secondary: Colors.blueGrey),
+              colorScheme: ColorScheme.fromSeed(
+                seedColor: Colors.blueGrey,
+                brightness: Brightness.dark,
+              ),
             )
           : ThemeData(
-              brightness: Brightness.light,
-              colorScheme:
-                  colorScheme.copyWith(secondary: Colors.lightBlueAccent),
+              colorScheme: ColorScheme.fromSeed(
+                seedColor: Colors.lightBlueAccent,
+              ),
             ),
       home: Scaffold(
+        appBar: AppBar(
+          shape: Border(
+            bottom: BorderSide(
+              color: Colors.black.withOpacity(0.12),
+            ),
+          ),
+          title: const Text(
+            'Log Console',
+            style: TextStyle(
+              fontSize: 20,
+              fontWeight: FontWeight.bold,
+            ),
+          ),
+          actions: [
+            IconButton(
+              icon: const Icon(Icons.add),
+              onPressed: () {
+                setState(() {
+                  _logFontSize++;
+                });
+              },
+            ),
+            IconButton(
+              icon: const Icon(Icons.remove),
+              onPressed: () {
+                setState(() {
+                  _logFontSize--;
+                });
+              },
+            ),
+            if (widget.showCloseButton)
+              IconButton(
+                icon: const Icon(Icons.close),
+                onPressed: () {
+                  Navigator.pop(context);
+                },
+              ),
+          ],
+        ),
         body: SafeArea(
           child: Column(
             crossAxisAlignment: CrossAxisAlignment.stretch,
             children: <Widget>[
-              _buildTopBar(),
               Expanded(
-                child: _buildLogContent(),
+                child: _buildLogContent(isDark),
               ),
-              _buildBottomBar(),
+              _buildBottomBar(isDark),
             ],
           ),
         ),
@@ -122,7 +160,7 @@ class _LogConsoleState extends State<LogConsole> {
               onPressed: _scrollToBottom,
               child: Icon(
                 Icons.arrow_downward,
-                color: widget.dark ? Colors.white : Colors.lightBlue[900],
+                color: isDark ? Colors.white : Colors.lightBlue[900],
               ),
             ),
           ),
@@ -152,9 +190,9 @@ class _LogConsoleState extends State<LogConsole> {
     }
   }
 
-  Widget _buildLogContent() {
+  Widget _buildLogContent(bool isDark) {
     return Container(
-      color: widget.dark ? Colors.black : Colors.grey[150],
+      color: isDark ? Colors.black : Colors.grey[150],
       child: SingleChildScrollView(
         scrollDirection: Axis.horizontal,
         child: SizedBox(
@@ -178,51 +216,10 @@ class _LogConsoleState extends State<LogConsole> {
     );
   }
 
-  Widget _buildTopBar() {
-    return LogBar(
-      dark: widget.dark,
-      child: Row(
-        children: <Widget>[
-          const Text(
-            'Log Console',
-            style: TextStyle(
-              fontSize: 20,
-              fontWeight: FontWeight.bold,
-            ),
-          ),
-          const Spacer(),
-          IconButton(
-            icon: const Icon(Icons.add),
-            onPressed: () {
-              setState(() {
-                _logFontSize++;
-              });
-            },
-          ),
-          IconButton(
-            icon: const Icon(Icons.remove),
-            onPressed: () {
-              setState(() {
-                _logFontSize--;
-              });
-            },
-          ),
-          if (widget.showCloseButton)
-            IconButton(
-              icon: const Icon(Icons.close),
-              onPressed: () {
-                Navigator.pop(context);
-              },
-            ),
-        ],
-      ),
-    );
-  }
-
   // ignore: long-method
-  Widget _buildBottomBar() {
+  Widget _buildBottomBar(bool isDark) {
     return LogBar(
-      dark: widget.dark,
+      dark: isDark,
       child: Row(
         children: <Widget>[
           Expanded(
@@ -293,7 +290,8 @@ class _LogConsoleState extends State<LogConsole> {
   }
 
   RenderedEvent _renderEvent(OutputEvent event) {
-    final parser = AnsiParser(dark: widget.dark);
+    final isDark = Theme.of(context).brightness == Brightness.dark;
+    final parser = AnsiParser(dark: isDark);
     final text = event.lines.join('\n');
     parser.parse(text);
 
diff --git a/lib/src/ui/components/logger/log_console_modal.dart b/lib/src/ui/components/logger/log_console_modal.dart
index 86f34f2..b2ca802 100644
--- a/lib/src/ui/components/logger/log_console_modal.dart
+++ b/lib/src/ui/components/logger/log_console_modal.dart
@@ -26,12 +26,7 @@ class LogConsoleModal extends ModalRoute<void> {
     Animation<double> animation,
     Animation<double> secondaryAnimation,
   ) {
-    return Scaffold(
-      body: LogConsole(
-        dark: Theme.of(context).brightness == Brightness.dark,
-        showCloseButton: true,
-      ),
-    );
+    return const Scaffold(body: LogConsole(showCloseButton: true));
   }
 
   @override
diff --git a/lib/src/ui/components/proxy/proxy_setting.dart b/lib/src/ui/components/proxy/proxy_setting.dart
index 0961521..39cdab4 100644
--- a/lib/src/ui/components/proxy/proxy_setting.dart
+++ b/lib/src/ui/components/proxy/proxy_setting.dart
@@ -1,6 +1,7 @@
 import 'package:dash_kit_control_panel/src/panel/control_panel_setting.dart';
 import 'package:dash_kit_control_panel/src/services/proxy_manager.dart';
 import 'package:dash_kit_control_panel/src/ui/components/setting_group.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 
@@ -156,19 +157,19 @@ class _ProxySettingState extends State<ProxySetting> {
     return TextFormField(
       focusNode: proxyIpFieldFocusNode,
       controller: proxyIpController,
-      decoration: const InputDecoration(
+      decoration: InputDecoration(
         labelText: 'Proxy IP address:',
         labelStyle: TextStyle(
-          color: Colors.white70,
+          color: AppColors.of(context).text,
           fontSize: 14,
         ),
-        contentPadding: EdgeInsets.symmetric(vertical: 4),
-        focusedBorder: UnderlineInputBorder(
+        contentPadding: const EdgeInsets.symmetric(vertical: 4),
+        focusedBorder: const UnderlineInputBorder(
           borderSide: BorderSide(color: Colors.green),
         ),
       ),
       style: TextStyle(
-        color: Colors.white.withAlpha(210),
+        color: AppColors.of(context).text,
         fontSize: 15,
       ),
       keyboardType: TextInputType.text,
diff --git a/lib/src/ui/components/push_notifications/push_notifications_setting.dart b/lib/src/ui/components/push_notifications/push_notifications_setting.dart
index 037076a..0813ff3 100644
--- a/lib/src/ui/components/push_notifications/push_notifications_setting.dart
+++ b/lib/src/ui/components/push_notifications/push_notifications_setting.dart
@@ -1,5 +1,6 @@
 import 'package:dash_kit_control_panel/src/panel/control_panel_setting.dart';
 import 'package:dash_kit_control_panel/src/ui/components/setting_group.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 import 'package:flutter/services.dart';
 
@@ -97,8 +98,8 @@ class _PushNotificationsSettingState extends State<PushNotificationsSetting> {
       controller: tokenController,
       decoration: InputDecoration(
         labelText: hasToken ? '${widget.props.label}:' : 'No value',
-        labelStyle: const TextStyle(
-          color: Colors.white70,
+        labelStyle: TextStyle(
+          color: AppColors.of(context).text,
           fontSize: 14,
         ),
         contentPadding: const EdgeInsets.symmetric(vertical: 4),
@@ -107,7 +108,7 @@ class _PushNotificationsSettingState extends State<PushNotificationsSetting> {
         ),
       ),
       style: TextStyle(
-        color: Colors.white.withAlpha(210),
+        color: AppColors.of(context).text,
         fontSize: 15,
       ),
       keyboardType: TextInputType.text,
diff --git a/lib/src/ui/components/setting_group.dart b/lib/src/ui/components/setting_group.dart
index 35ed058..ae4a3e3 100644
--- a/lib/src/ui/components/setting_group.dart
+++ b/lib/src/ui/components/setting_group.dart
@@ -1,10 +1,9 @@
 import 'dart:math';
 
 import 'package:dash_kit_control_panel/dash_kit_control_panel.dart';
-import 'package:dash_kit_control_panel/src/ui/resources/resources.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 
-// ignore_for_file: avoid-returning-widgets
 class SettingGroup extends StatelessWidget {
   const SettingGroup({
     required this.setting,
@@ -21,54 +20,56 @@ class SettingGroup extends StatelessWidget {
 
   @override
   Widget build(BuildContext context) {
+    final widget = Stack(
+      children: <Widget>[
+        Container(
+          margin: const EdgeInsets.symmetric(vertical: 8, horizontal: 10),
+          padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 12),
+          decoration: BoxDecoration(
+            border: Border.all(
+              color: AppColors.of(context).settingGroupBorder,
+            ),
+            borderRadius: BorderRadius.circular(5),
+            color:
+                backgroundColor ?? AppColors.of(context).settingGroupBackground,
+          ),
+          child: child,
+        ),
+        if (setting.title.isNotEmpty)
+          Align(
+            alignment: Alignment.centerLeft,
+            child: Container(
+              margin: const EdgeInsets.symmetric(horizontal: 22),
+              padding: const EdgeInsets.symmetric(
+                horizontal: 4,
+                vertical: sqrt1_2,
+              ),
+              decoration: BoxDecoration(
+                color: AppColors.of(context).settingLabelBackground,
+                border: Border.all(
+                  color: AppColors.of(context).settingGroupBorder,
+                ),
+                borderRadius: BorderRadius.circular(3),
+              ),
+              child: Text(
+                setting.title,
+                style: TextStyle(
+                  fontSize: 11,
+                  color: AppColors.of(context).title,
+                ),
+              ),
+            ),
+          ),
+      ],
+    );
+
     if (onTap != null) {
       return GestureDetector(
         onTap: onTap,
-        child: _buildContent(),
+        child: widget,
       );
     }
 
-    return _buildContent();
-  }
-
-  Widget _buildContent() {
-    return Stack(
-      children: <Widget>[
-        _buildSettingContent(),
-        if (setting.title.isNotEmpty) _buildTitle(),
-      ],
-    );
-  }
-
-  Widget _buildTitle() {
-    return Align(
-      alignment: Alignment.centerLeft,
-      child: Container(
-        margin: const EdgeInsets.symmetric(horizontal: 22),
-        padding: const EdgeInsets.symmetric(horizontal: 4, vertical: sqrt1_2),
-        decoration: BoxDecoration(
-          color: const Color.fromARGB(255, 40, 40, 40),
-          border: Border.all(color: R.color.settingGroupBorder),
-          borderRadius: BorderRadius.circular(3),
-        ),
-        child: Text(
-          setting.title,
-          style: const TextStyle(fontSize: 11, color: Colors.white54),
-        ),
-      ),
-    );
-  }
-
-  Widget _buildSettingContent() {
-    return Container(
-      margin: const EdgeInsets.symmetric(vertical: 8, horizontal: 10),
-      padding: const EdgeInsets.symmetric(vertical: 4, horizontal: 12),
-      decoration: BoxDecoration(
-        border: Border.all(color: R.color.settingGroupBorder),
-        borderRadius: BorderRadius.circular(5),
-        color: backgroundColor ?? R.color.settingGroupBackground,
-      ),
-      child: child,
-    );
+    return widget;
   }
 }
diff --git a/lib/src/ui/components/version/version_setting.dart b/lib/src/ui/components/version/version_setting.dart
index 10879d2..f0ae0ce 100644
--- a/lib/src/ui/components/version/version_setting.dart
+++ b/lib/src/ui/components/version/version_setting.dart
@@ -2,6 +2,7 @@ import 'dart:developer';
 
 import 'package:dash_kit_control_panel/src/panel/control_panel_setting.dart';
 import 'package:dash_kit_control_panel/src/ui/components/setting_group.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 import 'package:package_info_plus/package_info_plus.dart';
 
@@ -76,7 +77,7 @@ class _VersionSettingState extends State<VersionSetting> {
           Text(
             title,
             style: TextStyle(
-              color: Colors.white.withAlpha(240),
+              color: AppColors.of(context).text,
               fontWeight: FontWeight.w400,
               fontSize: 15,
             ),
@@ -85,7 +86,7 @@ class _VersionSettingState extends State<VersionSetting> {
           Text(
             value,
             style: TextStyle(
-              color: Colors.white.withAlpha(200),
+              color: AppColors.of(context).text,
               fontSize: 14,
             ),
           ),
diff --git a/lib/src/ui/control_panel_page.dart b/lib/src/ui/control_panel_page.dart
index 9099f7e..b1899dd 100644
--- a/lib/src/ui/control_panel_page.dart
+++ b/lib/src/ui/control_panel_page.dart
@@ -1,9 +1,8 @@
 import 'package:dash_kit_control_panel/src/panel/control_panel_setting.dart';
 import 'package:dash_kit_control_panel/src/ui/components/control_panel_title.dart';
-import 'package:dash_kit_control_panel/src/ui/resources/resources.dart';
+import 'package:dash_kit_control_panel/src/ui/theme/app_colors.dart';
 import 'package:flutter/material.dart';
 
-// ignore_for_file: avoid-returning-widgets
 class ControlPanelPage extends StatelessWidget {
   const ControlPanelPage({
     required this.settings,
@@ -17,25 +16,23 @@ class ControlPanelPage extends StatelessWidget {
     return Scaffold(
       appBar: AppBar(
         title: const ControlPanelTitle(title: 'Control Panel'),
-        backgroundColor: R.color.appBarBackground,
+        backgroundColor: AppColors.of(context).appBarBackground,
+        leading: BackButton(color: AppColors.of(context).backButton),
+        shape: Border(bottom: BorderSide(color: Colors.black.withOpacity(0.1))),
       ),
-      backgroundColor: R.color.panelBackground,
+      backgroundColor: AppColors.of(context).panelBackground,
       body: SafeArea(
         child: GestureDetector(
           behavior: HitTestBehavior.translucent,
           onTap: () => FocusScope.of(context).requestFocus(FocusNode()),
           child: SizedBox.expand(
-            child: _buildSettings(),
+            child: ListView(
+              padding: const EdgeInsets.symmetric(vertical: 12),
+              children: settings,
+            ),
           ),
         ),
       ),
     );
   }
-
-  Widget _buildSettings() {
-    return ListView(
-      padding: const EdgeInsets.symmetric(vertical: 12),
-      children: settings,
-    );
-  }
 }
diff --git a/lib/src/ui/resources/color_res.dart b/lib/src/ui/resources/color_res.dart
deleted file mode 100644
index 8df0784..0000000
--- a/lib/src/ui/resources/color_res.dart
+++ /dev/null
@@ -1,13 +0,0 @@
-part of 'resources.dart';
-
-class _ColorRes {
-  // MARK: Panel.
-  Color get panelBackground => const Color.fromARGB(155, 60, 60, 60);
-
-  Color get appBarBackground => const Color.fromARGB(155, 40, 40, 40);
-
-  // MARK: Settings.
-  Color get settingGroupBackground => Colors.black.withAlpha(17);
-
-  Color get settingGroupBorder => Colors.black.withAlpha(50);
-}
diff --git a/lib/src/ui/resources/resources.dart b/lib/src/ui/resources/resources.dart
deleted file mode 100644
index 50bd19e..0000000
--- a/lib/src/ui/resources/resources.dart
+++ /dev/null
@@ -1,11 +0,0 @@
-library resources;
-
-import 'package:flutter/material.dart';
-
-part 'color_res.dart';
-
-final R = _Resources();
-
-class _Resources {
-  final color = _ColorRes();
-}
diff --git a/lib/src/ui/theme/app_colors.dart b/lib/src/ui/theme/app_colors.dart
new file mode 100644
index 0000000..6b791a4
--- /dev/null
+++ b/lib/src/ui/theme/app_colors.dart
@@ -0,0 +1,56 @@
+import 'package:flutter/material.dart';
+
+class AppColors {
+  const AppColors._({
+    required this.backButton,
+    required this.panelBackground,
+    required this.appBarBackground,
+    required this.settingGroupBackground,
+    required this.settingGroupBorder,
+    required this.settingLabelBackground,
+    required this.text,
+    required this.title,
+  });
+
+  factory AppColors.light() {
+    return AppColors._(
+      backButton: Colors.black,
+      panelBackground: Colors.white,
+      appBarBackground: Colors.white,
+      settingGroupBackground: Colors.grey[100]!,
+      settingGroupBorder: Colors.black.withOpacity(0.05),
+      settingLabelBackground: Colors.grey[200]!,
+      text: Colors.black.withAlpha(240),
+      title: Colors.black54,
+    );
+  }
+
+  factory AppColors.dark() {
+    return AppColors._(
+      backButton: Colors.white,
+      panelBackground: const Color.fromARGB(155, 60, 60, 60),
+      appBarBackground: const Color.fromARGB(155, 40, 40, 40),
+      settingGroupBackground: Colors.black.withAlpha(17),
+      settingGroupBorder: Colors.black.withAlpha(50),
+      settingLabelBackground: const Color.fromARGB(255, 40, 40, 40),
+      text: Colors.white.withAlpha(240),
+      title: Colors.white54,
+    );
+  }
+
+  final Color backButton;
+  final Color panelBackground;
+  final Color appBarBackground;
+  final Color settingGroupBackground;
+  final Color settingGroupBorder;
+  final Color settingLabelBackground;
+  final Color text;
+  final Color title;
+
+  // ignore: prefer_constructors_over_static_methods
+  static AppColors of(BuildContext context) {
+    return Theme.of(context).brightness == Brightness.dark
+        ? AppColors.dark()
+        : AppColors.light();
+  }
+}
diff --git a/pubspec.lock b/pubspec.lock
index b38661d..afcd4db 100644
--- a/pubspec.lock
+++ b/pubspec.lock
@@ -5,10 +5,10 @@ packages:
     dependency: "direct main"
     description:
       name: alice_lightweight
-      sha256: cef2188ab0a272aeabd4824d924d354b70d627c9c7365e6ff168578b3b266a81
+      sha256: "44eca874655081dbfe48e01392ecf66c7fb2d3e98c315e9285bb7f4888efee61"
       url: "https://pub.dev"
     source: hosted
-    version: "3.6.0"
+    version: "3.7.0"
   async:
     dependency: transitive
     description:
@@ -53,18 +53,18 @@ packages:
     dependency: transitive
     description:
       name: cross_file
-      sha256: fd832b5384d0d6da4f6df60b854d33accaaeb63aa9e10e736a87381f08dee2cb
+      sha256: "55d7b444feb71301ef6b8838dbc1ae02e63dd48c8773f3810ff53bb1e2945b32"
       url: "https://pub.dev"
     source: hosted
-    version: "0.3.3+5"
+    version: "0.3.4+1"
   crypto:
     dependency: transitive
     description:
       name: crypto
-      sha256: aa274aa7774f8964e4f4f38cc994db7b6158dd36e9187aaceaddc994b35c6c67
+      sha256: ff625774173754681d66daaf4a448684fb04b78f902da9cb3d308c19cc5e8bab
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.2"
+    version: "3.0.3"
   dash_kit_lints:
     dependency: "direct main"
     description:
@@ -93,10 +93,10 @@ packages:
     dependency: transitive
     description:
       name: dio
-      sha256: "0978e9a3e45305a80a7210dbeaf79d6ee8bee33f70c8e542dc654c952070217f"
+      sha256: "11e40df547d418cc0c4900a9318b26304e665da6fa4755399a9ff9efd09034b5"
       url: "https://pub.dev"
     source: hosted
-    version: "5.4.2+1"
+    version: "5.4.3+1"
   fake_async:
     dependency: transitive
     description:
@@ -121,6 +121,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "6.1.4"
+  fixnum:
+    dependency: transitive
+    description:
+      name: fixnum
+      sha256: "25517a4deb0c03aa0f32fd12db525856438902d9c16536311e76cdc57b31d7d1"
+      url: "https://pub.dev"
+    source: hosted
+    version: "1.1.0"
   flutter:
     dependency: "direct main"
     description: flutter
@@ -181,14 +189,6 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "0.18.1"
-  js:
-    dependency: transitive
-    description:
-      name: js
-      sha256: f2c445dce49627136094980615a031419f7f3eb393237e4ecd97ac15dea343f3
-      url: "https://pub.dev"
-    source: hosted
-    version: "0.6.7"
   json_annotation:
     dependency: transitive
     description:
@@ -265,10 +265,10 @@ packages:
     dependency: transitive
     description:
       name: mime
-      sha256: e4ff8e8564c03f255408decd16e7899da1733852a9110a58fe6d1b817684a63e
+      sha256: "2e123074287cc9fd6c09de8336dae606d1ddb88d9ac47358826db698c176a1f2"
       url: "https://pub.dev"
     source: hosted
-    version: "1.0.4"
+    version: "1.0.5"
   nested:
     dependency: transitive
     description:
@@ -305,26 +305,26 @@ packages:
     dependency: transitive
     description:
       name: path_provider
-      sha256: b27217933eeeba8ff24845c34003b003b2b22151de3c908d0e679e8fe1aa078b
+      sha256: c9e7d3a4cd1410877472158bee69963a4579f78b68c65a2b7d40d1a7a88bb161
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.2"
+    version: "2.1.3"
   path_provider_android:
     dependency: transitive
     description:
       name: path_provider_android
-      sha256: "6b8b19bd80da4f11ce91b2d1fb931f3006911477cec227cce23d3253d80df3f1"
+      sha256: a248d8146ee5983446bf03ed5ea8f6533129a12b11f12057ad1b4a67a2b3b41d
       url: "https://pub.dev"
     source: hosted
-    version: "2.2.0"
+    version: "2.2.4"
   path_provider_foundation:
     dependency: transitive
     description:
       name: path_provider_foundation
-      sha256: "19314d595120f82aca0ba62787d58dde2cc6b5df7d2f0daf72489e38d1b57f2d"
+      sha256: "5a7999be66e000916500be4f15a3633ebceb8302719b47b9cc49ce924125350f"
       url: "https://pub.dev"
     source: hosted
-    version: "2.3.1"
+    version: "2.3.2"
   path_provider_linux:
     dependency: transitive
     description:
@@ -393,10 +393,10 @@ packages:
     dependency: transitive
     description:
       name: share_plus
-      sha256: "05ec043470319bfbabe0adbc90d3a84cbff0426b9d9f3a6e2ad3e131fa5fa629"
+      sha256: fb5319f3aab4c5dda5ebb92dca978179ba21f8c783ee4380910ef4c1c6824f51
       url: "https://pub.dev"
     source: hosted
-    version: "8.0.2"
+    version: "8.0.3"
   share_plus_platform_interface:
     dependency: transitive
     description:
@@ -474,6 +474,14 @@ packages:
       url: "https://pub.dev"
     source: hosted
     version: "1.10.0"
+  sprintf:
+    dependency: transitive
+    description:
+      name: sprintf
+      sha256: "1fc9ffe69d4df602376b52949af107d8f5703b77cda567c4d7d86a0693120f23"
+      url: "https://pub.dev"
+    source: hosted
+    version: "7.0.0"
   stack_trace:
     dependency: transitive
     description:
@@ -526,42 +534,42 @@ packages:
     dependency: transitive
     description:
       name: url_launcher_linux
-      sha256: b651aad005e0cb06a01dbd84b428a301916dc75f0e7ea6165f80057fee2d8e8e
+      sha256: ab360eb661f8879369acac07b6bb3ff09d9471155357da8443fd5d3cf7363811
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.6"
+    version: "3.1.1"
   url_launcher_platform_interface:
     dependency: transitive
     description:
       name: url_launcher_platform_interface
-      sha256: "95465b39f83bfe95fcb9d174829d6476216f2d548b79c38ab2506e0458787618"
+      sha256: "4aca1e060978e19b2998ee28503f40b5ba6226819c2b5e3e4d1821e8ccd92198"
       url: "https://pub.dev"
     source: hosted
-    version: "2.1.5"
+    version: "2.3.0"
   url_launcher_web:
     dependency: transitive
     description:
       name: url_launcher_web
-      sha256: "2942294a500b4fa0b918685aff406773ba0a4cd34b7f42198742a94083020ce5"
+      sha256: "8d9e750d8c9338601e709cd0885f95825086bd8b642547f26bda435aade95d8a"
       url: "https://pub.dev"
     source: hosted
-    version: "2.0.20"
+    version: "2.3.1"
   url_launcher_windows:
     dependency: transitive
     description:
       name: url_launcher_windows
-      sha256: "95fef3129dc7cfaba2bc3d5ba2e16063bb561fc6d78e63eee16162bc70029069"
+      sha256: ecf9725510600aa2bb6d7ddabe16357691b6d2805f66216a97d1b881e21beff7
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.8"
+    version: "3.1.1"
   uuid:
     dependency: transitive
     description:
       name: uuid
-      sha256: "648e103079f7c64a36dc7d39369cabb358d377078a051d6ae2ad3aa539519313"
+      sha256: "814e9e88f21a176ae1359149021870e87f7cddaf633ab678a5d2b0bff7fd1ba8"
       url: "https://pub.dev"
     source: hosted
-    version: "3.0.7"
+    version: "4.4.0"
   vector_math:
     dependency: transitive
     description:
diff --git a/pubspec.yaml b/pubspec.yaml
index af13a65..587a54e 100644
--- a/pubspec.yaml
+++ b/pubspec.yaml
@@ -1,13 +1,13 @@
 name: dash_kit_control_panel
 description: Control panel with debugging features for convenient app development.
-version: 4.2.0
+version: 4.3.0
 homepage: https://github.com/Dash-Kit/dash-kit-control-panel
 
 environment:
   sdk: ">=3.0.0 <4.0.0"
 
 dependencies:
-  alice_lightweight: ^3.6.0
+  alice_lightweight: ^3.7.0
   dash_kit_lints: ^3.0.3
   device_preview: ^1.1.0
   flutter: