diff --git a/config/schema/environment_indicator.schema.yml b/config/schema/environment_indicator.schema.yml
index f133e03541ab3f5fa2f3fa3589ce6bc8bf94300c..ac686f2ce504d9470d1127f40b9871bb66a6906f 100644
--- a/config/schema/environment_indicator.schema.yml
+++ b/config/schema/environment_indicator.schema.yml
@@ -36,6 +36,7 @@ environment_indicator.settings:
       sequence:
         type: string
         label: 'Toolbar identifier'
+      deprecated: "The 'toolbar_integration' config schema is deprecated in environment_indicator:4.0.22 and and is removed from environment_indicator:5.0.0. Use submodules for integrations instead. See http://drupal.org/node/3526893."
     favicon:
       type: boolean
       label: 'Show a colored favicon for environment'
diff --git a/css/environment_indicator.css b/css/environment_indicator.css
index 59be00167055303c5792dfd9578e5fc24a354c26..cf68c5ef3570f5b6aebcc7eb96124c51c525f8b9 100644
--- a/css/environment_indicator.css
+++ b/css/environment_indicator.css
@@ -71,6 +71,7 @@
   font-size: 1em;
 }
 
+/*  @todo: Remove everything below this comment in environment_indicator:5.0.0. */
 .toolbar .toolbar-bar .toolbar-tab > a.toolbar-icon.is-active::before {
   filter: invert(0%);
 }
@@ -83,16 +84,16 @@
 }
 
 .toolbar-bar .toolbar-icon-environment::before {
-  background-image: url("../images/env-bebebe.svg");
+  background-image: url("../modules/environment_indicator_toolbar/images/env-bebebe.svg");
 }
 .no-svg .toolbar-bar .toolbar-icon-environment::before {
-  background-image: url("../images/env-bebebe.png");
+  background-image: url("../modules/environment_indicator_toolbar/images/env-bebebe.png");
 }
 .toolbar-bar .toolbar-icon-environment.is-active::before {
-  background-image: url("../images/env-ffffff.svg");
+  background-image: url("../modules/environment_indicator_toolbar/images/env-ffffff.svg");
 }
 .no-svg .toolbar-bar .toolbar-icon-environment.is-active::before {
-  background-image: url("../images/env-ffffff.png");
+  background-image: url("../modules/environment_indicator_toolbar/images/env-ffffff.png");
 }
 .toolbar .toolbar-tray-vertical .edit-environments {
   padding: 1em;
diff --git a/environment_indicator.module b/environment_indicator.module
index 5acc4fe01c351ee3434cd05df0dde9884bf4843c..560d4a5559f9be6f0b6207444e8154680331a607 100644
--- a/environment_indicator.module
+++ b/environment_indicator.module
@@ -75,7 +75,16 @@ function environment_indicator_help($route_name, RouteMatchInterface $route_matc
  * Implements hook_preprocess_HOOK() for page templates.
  */
 function environment_indicator_preprocess_html(&$variables) {
-  if (_environment_indicator_external_integration_is_enabled('toolbar')) {
+  // Check if environment_indicator_toolbar is enabled.
+  $toolbar_integration_module_enabled = \Drupal::moduleHandler()->moduleExists('environment_indicator_toolbar') ?? FALSE;
+  // @todo Remove this check in environment_indicator:5.0.0.
+  // This is a temporary solution to avoid breaking existing sites that use
+  // the environment_indicator_toolbar module.
+  // In the future, we will rely on the environment_indicator_toolbar module
+  // to handle the toolbar integration, and this check will no longer be needed.
+  // @see https://www.drupal.org/i/3484735
+  $toolbar_integration_setting_enabled = !empty(\Drupal::config('environment_indicator.settings')->get('toolbar_integration')['toolbar']) ?? FALSE;
+  if ($toolbar_integration_module_enabled && $toolbar_integration_setting_enabled) {
     return;
   }
   $active_environment = \Drupal::config('environment_indicator.indicator');
@@ -91,19 +100,33 @@ function environment_indicator_preprocess_html(&$variables) {
  * Implements hook_page_top().
  */
 function environment_indicator_page_top(array &$page_top) {
-  if (_environment_indicator_external_integration_is_enabled('toolbar')) {
+  // Check if environment_indicator_toolbar is enabled.
+  $toolbar_integration_module_enabled = \Drupal::moduleHandler()->moduleExists('environment_indicator_toolbar') ?? FALSE;
+  if ($toolbar_integration_module_enabled) {
+    return;
+  }
+  // @todo Remove this check in environment_indicator:5.0.0.
+  // This is a temporary solution to avoid breaking existing sites that use
+  // the environment_indicator_toolbar module.
+  // In the future, we will rely on the environment_indicator_toolbar module
+  // to handle the toolbar integration, and this check will no longer be needed.
+  // @see https://www.drupal.org/i/3484735
+  // @phpstan-ignore-next-line
+  $toolbar_integration_setting_enabled = _environment_indicator_external_integration_is_enabled('toolbar');
+  if ($toolbar_integration_setting_enabled) {
     return;
   }
   $active_environment = \Drupal::config('environment_indicator.indicator');
-  $title = \Drupal::service('environment_indicator.indicator')->getTitle();
+  $environment_indicator = \Drupal::service('environment_indicator.indicator');
   $current_user_has_access = \Drupal::currentUser()->hasPermission('access environment indicator');
+  $settings = \Drupal::config('environment_indicator.settings');
   $name = $active_environment->get('name');
   $page_top['indicator'] = [
     '#type' => 'environment_indicator',
-    '#title' => $title,
+    '#title' => $name,
     '#fg_color' => $active_environment->get('fg_color'),
     '#bg_color' => $active_environment->get('bg_color'),
-    '#description' => \Drupal::state()->get('environment_indicator.current_release'),
+    '#description' => $environment_indicator->getCurrentRelease(),
     '#access' => !empty($name) && $current_user_has_access,
     '#attached' => [
       'library' => ['environment_indicator/drupal.environment_indicator'],
@@ -112,8 +135,8 @@ function environment_indicator_page_top(array &$page_top) {
           'name' => $name,
           'fgColor' => $active_environment->get('fg_color'),
           'bgColor' => $active_environment->get('bg_color'),
-          'addFavicon' => \Drupal::config('environment_indicator.settings')
-            ->get('favicon'),
+          'addFavicon' => $settings->get('favicon'),
+          // @phpstan-ignore-next-line
           'toolbars' => _environment_indicator_external_integration_is_enabled('toolbar'),
         ],
       ],
@@ -126,8 +149,7 @@ function environment_indicator_page_top(array &$page_top) {
   }
   // Only add the environment indicator switcher if there are environments to
   // switch to.
-  if ($items = _environment_indicator_switcher_links()) {
-    uasort($items, 'Drupal\Component\Utility\SortArray::sortByWeightElement');
+  if ($items = \Drupal::service('environment_indicator.indicator')->getLinks()) {
     $page_top['indicator']['switcher'] = [
       '#theme' => 'links',
       '#links' => $items,
@@ -143,7 +165,7 @@ function environment_indicator_page_top(array &$page_top) {
     ];
     $page_top['indicator'] += [
       '#cache' => [
-        'tags' => Cache::mergeTags(['config:environment_indicator.settings'], _environment_indicator_switcher_cache_tags()),
+        'tags' => Cache::mergeTags(['config:environment_indicator.settings'], \Drupal::service('environment_indicator.indicator')->getCacheTags()),
       ],
     ];
   }
@@ -219,8 +241,16 @@ function _environment_indicator_parse_style(string $style): array {
 
 /**
  * Implements hook_toolbar().
+ *
+ *  @todo Remove this in environment_indicator:5.0.0.
  */
 function environment_indicator_toolbar() {
+  // Check if environment_indicator_toolbar is enabled.
+  $toolbar_integration_module_enabled = \Drupal::moduleHandler()->moduleExists('environment_indicator_toolbar') ?? FALSE;
+  if ($toolbar_integration_module_enabled) {
+    return [];
+  }
+  // @todo Remove this check in environment_indicator:5.0.0.
   return \Drupal::service('environment_indicator.toolbar_handler')
     ->toolbar();
 }
@@ -230,6 +260,11 @@ function environment_indicator_toolbar() {
  *
  * @return array
  *   A renderable array with the links.
+ *
+ * @deprecated in environment_indicator:4.0.22 and is removed from environment_indicator:5.0.0.
+ *   Use \Drupal\environment_indicator\Service\SwitcherManager::getLinks().
+ *
+ * @see https://www.drupal.org/node/3526893
  */
 function _environment_indicator_switcher_links(): array {
   // @phpstan-ignore-next-line
@@ -245,6 +280,14 @@ function _environment_indicator_switcher_links(): array {
  *
  * @return bool
  *   TRUE if integration is enabled. FALSE otherwise.
+ *
+ * @deprecated in environment_indicator:4.0.22 and is removed from environment_indicator:5.0.0.
+ *   This functionality is no longer needed because now to add toolbar
+ *   integration, you enable the environment_indicator_toolbar module.
+ *   Then you can replicate this functionality by using the
+ *   core.extension.service to check if the module is enabled.
+ *
+ * @see https://www.drupal.org/project/environment_indicator/issues/3484735
  */
 function _environment_indicator_external_integration_is_enabled(string $integration): bool {
   return \Drupal::service('environment_indicator.toolbar_handler')
@@ -256,6 +299,12 @@ function _environment_indicator_external_integration_is_enabled(string $integrat
  *
  * @return string[]
  *   The cache tags.
+ *
+ * @deprecated in environment_indicator:4.0.22 and is removed from environment_indicator:5.0.0.
+ *   Use
+ *   \Drupal\environment_indicator\Service\EnvironmentIndicator::getCacheTags().
+ *
+ * @see https://www.drupal.org/node/3526893
  */
 function _environment_indicator_switcher_cache_tags(): array {
   // @phpstan-ignore-next-line
diff --git a/js/environment_indicator.js b/js/environment_indicator.js
index 93f7dfeb1bd4a24b4de3c1141c2c681b3e1ef209..6c37cc582c146cb0ab1b5c2f119e774402180fdd 100644
--- a/js/environment_indicator.js
+++ b/js/environment_indicator.js
@@ -17,6 +17,7 @@
     },
   };
 
+  // @todo Remove this function in environment_indicator 5.0.0
   Drupal.behaviors.environmentIndicatorToolbar = {
     attach(context, settings) {
       if (settings.environmentIndicator !== undefined) {
@@ -37,11 +38,17 @@
           document
             .querySelectorAll('#toolbar-bar .toolbar-item a:not(.is-active)')
             .forEach((el) => {
+              el.style.borderBottom = '0px';
               el.style.color = settings.environmentIndicator.fgColor;
-              return el;
+            });
+          document
+            .querySelectorAll(
+              '.toolbar .toolbar-bar .toolbar-tab > .toolbar-item',
+            )
+            .forEach((el) => {
+              el.style.backgroundColor = settings.environmentIndicator.bgColor;
             });
         }
-
         // Set environment color for gin_toolbar vertical toolbar.
         if ($body.hasClass('gin--vertical-toolbar')) {
           document.querySelector(
@@ -60,7 +67,6 @@
               return el;
             });
         }
-
         // Set environment color for gin_toolbar horizontal toolbar.
         if ($body.hasClass('gin--horizontal-toolbar')) {
           document.querySelector(
@@ -70,7 +76,6 @@
             '#toolbar-item-administration-tray',
           ).style.borderTopWidth = borderWidth;
         }
-
         // Set environment color on the icon of the gin_toolbar
         if (
           $body.hasClass('gin--horizontal-toolbar') ||
diff --git a/modules/environment_indicator_toolbar/css/toolbar.css b/modules/environment_indicator_toolbar/css/toolbar.css
new file mode 100644
index 0000000000000000000000000000000000000000..39ec6b9984fc06307697ad6b61b438e192302845
--- /dev/null
+++ b/modules/environment_indicator_toolbar/css/toolbar.css
@@ -0,0 +1,73 @@
+:root {
+    --environment-indicator-border-width: 6px;
+}
+
+.toolbar .toolbar-bar .toolbar-tab>a.toolbar-icon.is-active::before {
+    filter: invert(0%);
+}
+
+.toolbar .toolbar-bar .toolbar-tab>a.toolbar-icon.is-active {
+    background-image: linear-gradient(
+        rgba(255, 255, 255, 0.25) 20%,
+        transparent 200%
+    );
+}
+
+.toolbar-bar .toolbar-icon-environment::before {
+    background-image: url("../images/env-bebebe.svg");
+}
+
+.no-svg .toolbar-bar .toolbar-icon-environment::before {
+    background-image: url("../images/env-bebebe.png");
+}
+
+.toolbar-bar .toolbar-icon-environment.is-active::before {
+    background-image: url("../images/env-ffffff.svg");
+}
+
+.no-svg .toolbar-bar .toolbar-icon-environment.is-active::before {
+    background-image: url("../images/env-ffffff.png");
+}
+
+.toolbar .toolbar-tray-vertical .edit-environments {
+    padding: 1em;
+    text-align: right;
+}
+
+.toolbar .toolbar-tray-horizontal .edit-environments {
+    float: right;
+}
+
+/* Style fixes for gin_toolbar */
+.gin--vertical-toolbar .toolbar-menu-administration {
+    border-left: var(--environment-indicator-border-width) solid;
+}
+
+.gin--horizontal-toolbar #toolbar-item-administration-tray {
+    border-top: var(--environment-indicator-border-width) solid;
+    border-bottom: 0;
+}
+
+.gin--horizontal-toolbar .gin-secondary-toolbar {
+    margin-top: var(--environment-indicator-border-width);
+}
+
+.gin--vertical-toolbar .toolbar-menu-administration>.toolbar-menu>.menu-item .toolbar-menu {
+    margin-inline-start: calc(
+        // stylelint-disable custom-property-pattern
+        // See https://www.drupal.org/i/3309113
+        // See https://www.drupal.org/i/3524015
+        var(--gin-toolbar-width-collapsed, var(--ginToolbarWidthCollapsed)) - 4px
+        // stylelint-enable custom-property-pattern 
+    );
+}
+
+.gin--vertical-toolbar[data-toolbar-menu="open"] .toolbar-menu-administration>.toolbar-menu>.menu-item .toolbar-menu {
+    margin-inline-start: calc(
+        // stylelint-disable custom-property-pattern
+        // See https://www.drupal.org/i/3309113
+        // See https://www.drupal.org/i/3524015
+        var(--gin-toolbar-width, var(--ginToolbarWidth)) - 4px
+        // stylelint-enable custom-property-pattern
+    );
+}
diff --git a/modules/environment_indicator_toolbar/environment_indicator_toolbar.info.yml b/modules/environment_indicator_toolbar/environment_indicator_toolbar.info.yml
new file mode 100644
index 0000000000000000000000000000000000000000..0556d4818cca95848cdb89c895b26300004df83c
--- /dev/null
+++ b/modules/environment_indicator_toolbar/environment_indicator_toolbar.info.yml
@@ -0,0 +1,9 @@
+name: 'Environment Indicator - Toolbar Integration'
+type: module
+description: 'Changes the toolbar background and text color depending on environment.'
+package: Development
+core_version_requirement: '^9.3 || ^10 || ^11'
+dependencies:
+  - drupal:toolbar
+  - environment_indicator:environment_indicator
+configure: environment_indicator_ui.settings
diff --git a/modules/environment_indicator_toolbar/environment_indicator_toolbar.install b/modules/environment_indicator_toolbar/environment_indicator_toolbar.install
new file mode 100644
index 0000000000000000000000000000000000000000..f8a2329f0f124f63d8cc1f66b93e07efcb3008a5
--- /dev/null
+++ b/modules/environment_indicator_toolbar/environment_indicator_toolbar.install
@@ -0,0 +1,24 @@
+<?php
+
+/**
+ * @file
+ * Install, update and uninstall functions.
+ */
+
+/**
+ * Ensure toolbar_integration setting is empty if it exists.
+ *
+ * Otherwise, do not change the configuration.
+ * This is here to help upgrade from versions of the Environment Indicator
+ * module that have a removed function for toolbar integration.
+ */
+function environment_indicator_toolbar_install() {
+  // Check if toolbar integration is enabled.
+  $config_factory = \Drupal::configFactory();
+  $settings = $config_factory->getEditable('environment_indicator.settings');
+
+  if ($settings->get('toolbar_integration')) {
+    $settings->set('toolbar_integration', []);
+    $settings->save();
+  }
+}
diff --git a/modules/environment_indicator_toolbar/environment_indicator_toolbar.libraries.yml b/modules/environment_indicator_toolbar/environment_indicator_toolbar.libraries.yml
new file mode 100644
index 0000000000000000000000000000000000000000..3fb6c4a8c9e4559cf0916468249bafa3be55fa1f
--- /dev/null
+++ b/modules/environment_indicator_toolbar/environment_indicator_toolbar.libraries.yml
@@ -0,0 +1,11 @@
+toolbar:
+  js:
+    js/toolbar.js: {}
+  css:
+    component:
+      css/toolbar.css: {}
+  dependencies:
+    - core/drupal
+    - core/jquery
+    - core/drupalSettings
+    - core/toolbar
diff --git a/modules/environment_indicator_toolbar/environment_indicator_toolbar.module b/modules/environment_indicator_toolbar/environment_indicator_toolbar.module
new file mode 100644
index 0000000000000000000000000000000000000000..5fd6045acb236e15e92e80635afa0c389084d18a
--- /dev/null
+++ b/modules/environment_indicator_toolbar/environment_indicator_toolbar.module
@@ -0,0 +1,91 @@
+<?php
+
+/**
+ * @file
+ * Module implementation file.
+ */
+
+use Drupal\Core\Cache\Cache;
+use Drupal\Core\Url;
+
+/**
+ * Implements hook_toolbar().
+ */
+function environment_indicator_toolbar_toolbar() {
+  $config = \Drupal::config('environment_indicator.settings');
+  $activeEnvironment = \Drupal::config('environment_indicator.indicator');
+  $environmentIndicator = \Drupal::service('environment_indicator.indicator');
+  $account = \Drupal::currentUser();
+  $items = [];
+  $items['environment_indicator'] = [
+    '#cache' => [
+      'contexts' => ['user.permissions'],
+    ],
+  ];
+  $title = $environmentIndicator->getTitle();
+  $name = $activeEnvironment->get('name');
+  $items['environment_indicator'] += [
+    '#type' => 'toolbar_item',
+    '#weight' => 125,
+    'tab' => [
+      '#type' => 'link',
+      '#title' => $title,
+      '#url' => Url::fromRoute('environment_indicator.settings'),
+      '#attributes' => [
+        'title' => t('Environments'),
+        'class' => ['toolbar-icon', 'toolbar-icon-environment'],
+      ],
+      '#access' => !empty($name) && $account->hasPermission('access environment indicator'),
+    ],
+    'tray' => [
+      '#heading' => t('Environments menu'),
+    ],
+    '#attached' => [
+      'library' => [
+        'environment_indicator_toolbar/toolbar',
+      ],
+      'drupalSettings' => [
+        'environmentIndicator' => [
+          'name' => $name,
+          'fgColor' => $activeEnvironment->get('fg_color'),
+          'bgColor' => $activeEnvironment->get('bg_color'),
+          'toolbars' => ['toolbar' => 'toolbar'],
+        ],
+      ],
+    ],
+  ];
+  if ($config->get('favicon')) {
+    $items['environment_indicator']['#attached']['drupalSettings']['environmentIndicator']['addFavicon'] = $config->get('favicon');
+    $items['environment_indicator']['#attached']['library'][] = 'environment_indicator/favicon';
+  }
+  // Add cache tags to the toolbar item while preserving context.
+  $items['environment_indicator']['#cache']['tags'] = Cache::mergeTags(
+    [
+      'config:environment_indicator.settings',
+      'config:environment_indicator.indicator',
+    ],
+    $environmentIndicator->getCacheTags()
+  );
+  if ($account->hasPermission('administer environment indicator settings')) {
+    $items['environment_indicator']['tray']['configuration'] = [
+      '#type' => 'link',
+      '#title' => t('Configure'),
+      '#url' => Url::fromRoute('environment_indicator.settings'),
+      '#options' => [
+        'attributes' => ['class' => ['edit-environments']],
+      ],
+    ];
+  }
+
+  if ($links = $environmentIndicator->getLinks()) {
+    $items['environment_indicator']['tray']['environment_links'] = [
+      '#theme' => 'links__toolbar_shortcuts',
+      '#links' => $links,
+      '#attributes' => [
+        'class' => ['toolbar-menu'],
+      ],
+    ];
+  }
+
+  return $items;
+}
diff --git a/images/env-bebebe.png b/modules/environment_indicator_toolbar/images/env-bebebe.png
similarity index 100%
rename from images/env-bebebe.png
rename to modules/environment_indicator_toolbar/images/env-bebebe.png
diff --git a/images/env-bebebe.svg b/modules/environment_indicator_toolbar/images/env-bebebe.svg
similarity index 100%
rename from images/env-bebebe.svg
rename to modules/environment_indicator_toolbar/images/env-bebebe.svg
diff --git a/images/env-ffffff.png b/modules/environment_indicator_toolbar/images/env-ffffff.png
similarity index 100%
rename from images/env-ffffff.png
rename to modules/environment_indicator_toolbar/images/env-ffffff.png
diff --git a/images/env-ffffff.svg b/modules/environment_indicator_toolbar/images/env-ffffff.svg
similarity index 100%
rename from images/env-ffffff.svg
rename to modules/environment_indicator_toolbar/images/env-ffffff.svg
diff --git a/modules/environment_indicator_toolbar/js/toolbar.js b/modules/environment_indicator_toolbar/js/toolbar.js
new file mode 100644
index 0000000000000000000000000000000000000000..8dde2e90cbd7baafa5e498bee5579696de436545
--- /dev/null
+++ b/modules/environment_indicator_toolbar/js/toolbar.js
@@ -0,0 +1,72 @@
+(function ($, Drupal) {
+  Drupal.behaviors.environmentIndicatorToolbar = {
+    attach(context, settings) {
+      if (settings.environmentIndicator !== undefined) {
+        const $body = $('body');
+        const borderWidth =
+          getComputedStyle(document.body).getPropertyValue(
+            '--environment-indicator-border-width',
+          ) || '6px';
+        // Set environment color if not using gin_toolbar.
+        if (
+          settings.environmentIndicator.toolbars.toolbar === 'toolbar' &&
+          !$body.hasClass('gin--vertical-toolbar') &&
+          !$body.hasClass('gin--horizontal-toolbar')
+        ) {
+          // Replaced $.css with direct style assignment using JavaScript.
+          document.querySelector('#toolbar-bar').style.backgroundColor =
+            settings.environmentIndicator.bgColor;
+          document
+            .querySelectorAll('#toolbar-bar .toolbar-tab a.toolbar-item')
+            .forEach((el) => {
+              el.style.borderBottom = '0px';
+              el.style.color = settings.environmentIndicator.fgColor;
+            });
+          document
+            .querySelectorAll(
+              '.toolbar .toolbar-bar .toolbar-tab > .toolbar-item',
+            )
+            .forEach((el) => {
+              el.style.backgroundColor = settings.environmentIndicator.bgColor;
+            });
+        }
+        // Set environment color for gin_toolbar vertical toolbar.
+        if ($body.hasClass('gin--vertical-toolbar')) {
+          document.querySelector(
+            '.toolbar-menu-administration',
+          ).style.borderLeftColor = settings.environmentIndicator.bgColor;
+          document.querySelector(
+            '.toolbar-menu-administration',
+          ).style.borderLeftWidth = borderWidth;
+          document
+            .querySelectorAll(
+              '.toolbar-tray-horizontal .toolbar-menu li.menu-item',
+            )
+            .forEach((el) => {
+              el.style.marginLeft =
+                'calc(var(--environment-indicator-border-width) * -0.5)';
+              return el;
+            });
+        }
+        // Set environment color for gin_toolbar horizontal toolbar.
+        if ($body.hasClass('gin--horizontal-toolbar')) {
+          document.querySelector(
+            '#toolbar-item-administration-tray',
+          ).style.borderTopColor = settings.environmentIndicator.bgColor;
+          document.querySelector(
+            '#toolbar-item-administration-tray',
+          ).style.borderTopWidth = borderWidth;
+        }
+        // Set environment color on the icon of the gin_toolbar
+        if (
+          $body.hasClass('gin--horizontal-toolbar') ||
+          $body.hasClass('gin--vertical-toolbar')
+        ) {
+          $('head', context).append(
+            `<style>.toolbar .toolbar-bar #toolbar-item-administration-tray a.toolbar-icon-admin-toolbar-tools-help.toolbar-icon-default::before{ background-color: ${settings.environmentIndicator.bgColor} }</style>`,
+          );
+        }
+      }
+    },
+  };
+})(jQuery, Drupal);
diff --git a/src/Form/EnvironmentIndicatorSettingsForm.php b/src/Form/EnvironmentIndicatorSettingsForm.php
index bd857d67c5549efa3811ca303e03aced946e91b2..9a06165cbe75cce768af990038867ee36b9adebd 100644
--- a/src/Form/EnvironmentIndicatorSettingsForm.php
+++ b/src/Form/EnvironmentIndicatorSettingsForm.php
@@ -4,12 +4,56 @@ namespace Drupal\environment_indicator\Form;
 
 use Drupal\Core\Form\ConfigFormBase;
 use Drupal\Core\Form\FormStateInterface;
+use Drupal\Core\Config\ConfigFactoryInterface;
+use Drupal\Core\Config\TypedConfigManagerInterface;
+use Drupal\Core\Extension\ModuleHandlerInterface;
+use Symfony\Component\DependencyInjection\ContainerInterface;
 
 /**
- * Basic Environment Indicator controls form.
+ * Configure System settings for this site.
  */
 class EnvironmentIndicatorSettingsForm extends ConfigFormBase {
 
+  /**
+   * The module handler service.
+   *
+   * @var \Drupal\Core\Extension\ModuleHandlerInterface
+   */
+  protected $moduleHandler;
+
+  /**
+   * Constructs a MenuLinksetSettingsForm object.
+   *
+   * @param \Drupal\Core\Config\ConfigFactoryInterface $config_factory
+   *   The factory for configuration objects.
+   * @param \Drupal\Core\Config\TypedConfigManagerInterface $typedConfigManager
+   *   The typed config manager.
+   * @param \Drupal\Core\Extension\ModuleHandlerInterface $module_handler
+   *   The module handler service.
+   */
+  public function __construct(
+    ConfigFactoryInterface $config_factory,
+    TypedConfigManagerInterface $typedConfigManager,
+    ModuleHandlerInterface $module_handler,
+  ) {
+    parent::__construct(
+      $config_factory,
+      $typedConfigManager
+    );
+    $this->moduleHandler = $module_handler;
+  }
+
+  /**
+   * {@inheritdoc}
+   */
+  public static function create(ContainerInterface $container) {
+    return new static(
+      $container->get('config.factory'),
+      $container->get('config.typed'),
+      $container->get('module_handler')
+    );
+  }
+
   /**
    * {@inheritdoc}
    */
@@ -22,19 +66,31 @@ class EnvironmentIndicatorSettingsForm extends ConfigFormBase {
    */
   public function buildForm(array $form, FormStateInterface $form_state) {
     $config = $this->config('environment_indicator.settings');
-
+    $toolbar_integration_module_enabled = $this->moduleHandler->moduleExists('environment_indicator_toolbar') ?? FALSE;
+    $toolbar_integration_setting_enabled = !empty($config->get('toolbar_integration'));
     $form = parent::buildForm($form, $form_state);
-
     $form['toolbar_integration'] = [
       '#type' => 'checkboxes',
-      '#title' => $this->t('Toolbar integration'),
+      '#title' => $this->t('Toolbar integration (Deprecated)'),
       '#options' => [
-        'toolbar' => $this->t('Toolbar'),
+        'toolbar' => $this->t('Toolbar (Deprecated)'),
       ],
-      '#description' => $this->t('Select the toolbars that you want to integrate with.'),
+      '#description' => $this->t('This setting is deprecated and will be removed in a future release. Please enable the <strong>Environment Indicator - Toolbar Integration</strong> module to remove this setting early.'),
       '#default_value' => $config->get('toolbar_integration') ?: [],
     ];
-
+    // If the toolbar integration settings are empty, we remove the
+    // toolbar integration settings from the form.
+    if (!$toolbar_integration_setting_enabled) {
+      unset($form['toolbar_integration']);
+    }
+    // If the toolbar integration module is not enabled, we add a message to
+    // inform the user.
+    if (!$toolbar_integration_module_enabled) {
+      $form['toolbar_integration_message'] = [
+        '#type' => 'item',
+        '#markup' => $this->t('The <strong>Environment Indicator - Toolbar Integration</strong> (<code>environment_indicator_toolbar</code>) module is not enabled. Please enable it to enable toolbar integration.'),
+      ];
+    }
     $form['favicon'] = [
       '#type' => 'checkbox',
       '#title' => $this->t('Show favicon'),
@@ -109,14 +165,18 @@ class EnvironmentIndicatorSettingsForm extends ConfigFormBase {
   public function submitForm(array &$form, FormStateInterface $form_state) {
     $config = $this->config('environment_indicator.settings');
 
-    $config->set('toolbar_integration', array_filter($form_state->getValue('toolbar_integration')))
+    $config
       ->set('favicon', $form_state->getValue('favicon'))
       ->set('version_identifier', $form_state->getValue('version_identifier'))
       ->set('version_identifier_fallback', $form_state->getValue('version_identifier_fallback'))
       ->save();
 
-    parent::submitForm($form, $form_state);
+    if (isset($form['toolbar_integration'])) {
+      $config->set('toolbar_integration', array_filter($form_state->getValue('toolbar_integration')))
+        ->save();
+    }
 
+    parent::submitForm($form, $form_state);
   }
 
 }
diff --git a/src/ToolbarHandler.php b/src/ToolbarHandler.php
index b9f97cd2aa34575c49705beca2c2702cbb18dc19..95813988ba6d90b197041cf74966fae435c305ba 100644
--- a/src/ToolbarHandler.php
+++ b/src/ToolbarHandler.php
@@ -15,8 +15,15 @@ use Drupal\Core\Url;
 use Drupal\environment_indicator\Entity\EnvironmentIndicator as EnvironmentSwitcher;
 use Drupal\environment_indicator\Service\EnvironmentIndicator;
 
+@trigger_error('The ' . __NAMESPACE__ . '\ToolbarHandler is deprecated in environment_indicator:4.0.22 and is removed from environment_indicator:5.0.0. Instead, use \Drupal\environment_indicator\Service\EnvironmentIndicator or the environment_indicator_toolbar module. See https://www.drupal.org/node/3526893', E_USER_DEPRECATED);
+
 /**
  * Toolbar integration handler.
+ *
+ * @deprecated in environment_indicator:4.0.22 and is removed from environment_indicator:5.0.0. Use
+ * \Drupal\environment_indicator_toolbar\Service\ToolbarHandler.
+ *
+ * @see https://www.drupal.org/node/3526893
  */
 class ToolbarHandler {
 
diff --git a/tests/src/Functional/EnvironmentIndicatorTest.php b/tests/src/Functional/EnvironmentIndicatorTest.php
index b81953c8953265d0750fce40473063ab686a3515..f91ff2c10171fa1c3172587143608031c396071e 100644
--- a/tests/src/Functional/EnvironmentIndicatorTest.php
+++ b/tests/src/Functional/EnvironmentIndicatorTest.php
@@ -73,9 +73,10 @@ class EnvironmentIndicatorTest extends BrowserTestBase {
     // Retrieve the dynamic module path.
     $moduleHandler = \Drupal::service('extension.list.module');
     $this->modulePath = $moduleHandler->getPath('environment_indicator');
-
+    $settings = $this->config('environment_indicator.settings');
+    $settings->set('toolbar_integration', [])
+      ->save();
     $this->state = \Drupal::state();
-
     // Create users.
     $this->privilegedUser = $this->drupalCreateUser(['access environment indicator']);
     $this->unprivilegedUser = $this->drupalCreateUser();
@@ -104,6 +105,7 @@ class EnvironmentIndicatorTest extends BrowserTestBase {
     $this->assertStringContainsString('background-color: red', $output);
     $this->assertStringContainsString('color: green', $output);
     $this->assertSession()->elementExists("css", "link[href*='{$this->modulePath}/css/environment_indicator.css']");
+    $this->resetAll();
     // Change configuration values.
     $config = $this->config('environment_indicator.indicator');
     $config->set('name', 'Test Environment')
@@ -121,7 +123,7 @@ class EnvironmentIndicatorTest extends BrowserTestBase {
     $this->assertNotEmpty($output, 'Style attribute should not be empty.');
     $this->assertStringContainsString('background-color: #000000', $output);
     $this->assertStringContainsString('color: #ffffff', $output);
-
+    $this->resetAll();
     // Change configuration values.
     $config = $this->config('environment_indicator.indicator');
     $config->set('name', 'Development Environment')
diff --git a/tests/src/Functional/ToolbarIntegrationTest.php b/tests/src/Functional/ToolbarIntegrationTest.php
index 2c9b5a8ab324d0ed250d4846007b1afbfb3b7496..2dc84ab6c1502eece3bcc5508cab557198fa6b64 100644
--- a/tests/src/Functional/ToolbarIntegrationTest.php
+++ b/tests/src/Functional/ToolbarIntegrationTest.php
@@ -124,9 +124,6 @@ class ToolbarIntegrationTest extends BrowserTestBase {
       ->set('fg_color', '#000000')
       ->set('bg_color', '#ffffff')
       ->save();
-    $settings = $this->config('environment_indicator.settings');
-    $settings->set('toolbar_integration', ['toolbar' => 'toolbar'])
-      ->save();
     // Clear drupal cache.
     $this->container->get('cache_tags.invalidator')->invalidateTags(['config:environment_indicator.indicator']);
     $this->drupalLogin($this->privilegedUser);
diff --git a/tests/src/FunctionalJavascript/EnvironmentIndicatorTest.php b/tests/src/FunctionalJavascript/EnvironmentIndicatorTest.php
index 6b0005c276c65953a150f35979042051704afb60..6c7ce22563db77e1c90513b16370eb7209cde38b 100644
--- a/tests/src/FunctionalJavascript/EnvironmentIndicatorTest.php
+++ b/tests/src/FunctionalJavascript/EnvironmentIndicatorTest.php
@@ -65,7 +65,10 @@ class EnvironmentIndicatorTest extends WebDriverTestBase {
     // Retrieve the dynamic module path.
     $moduleHandler = \Drupal::service('extension.list.module');
     $this->modulePath = $moduleHandler->getPath('environment_indicator');
-
+    // Turn off the toolbar integration for the environment indicator.
+    $settings = $this->config('environment_indicator.settings');
+    $settings->set('toolbar_integration', [])
+      ->save();
     // Create users.
     $this->privilegedUser = $this->drupalCreateUser(['access environment indicator']);
     $this->environmentIndicatorAdministrator = $this->drupalCreateUser([