diff --git a/core/modules/toolbar/css/toolbar.icons.theme.css b/core/modules/toolbar/css/toolbar.icons.theme.css
deleted file mode 100644
index 69f0df8..0000000
--- a/core/modules/toolbar/css/toolbar.icons.theme.css
+++ /dev/null
@@ -1,305 +0,0 @@
-/**
- * @file
- * Styling for toolbar module icons.
- */
-
-.toolbar .toolbar-icon {
-  padding-left: 2.75em; /* LTR */
-  position: relative;
-}
-[dir="rtl"] .toolbar .toolbar-icon {
-  padding-left: 1.3333em;
-  padding-right: 2.75em;
-}
-.toolbar .toolbar-icon:before {
-  background-attachment: scroll;
-  background-color: transparent;
-  background-position: center center;
-  background-repeat: no-repeat;
-  background-size: 100% auto;
-  content: '';
-  display: block;
-  height: 100%;
-  left: 0.6667em; /* LTR */
-  position: absolute;
-  top: 0;
-  width: 20px;
-}
-[dir="rtl"] .toolbar .toolbar-icon:before {
-  left: auto;
-  right: 0.6667em;
-}
-.toolbar button.toolbar-icon {
-  background-color: transparent;
-  border: 0;
-  font-size: 1em;
-}
-.toolbar .toolbar-menu ul .toolbar-icon {
-  padding-left: 1.3333em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-menu ul .toolbar-icon {
-  padding-left: 0;
-  padding-right: 1.3333em;
-}
-.toolbar .toolbar-menu ul a.toolbar-icon:before {
-  display: none;
-}
-.toolbar .toolbar-tray-vertical .toolbar-menu ul a {
-  padding-left: 2.75em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul a {
-  padding-left: 0;
-  padding-right: 2.75em;
-}
-.toolbar .toolbar-tray-vertical .toolbar-menu ul ul a {
-  padding-left: 3.75em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul ul a {
-  padding-left: 0;
-  padding-right: 3.75em;
-}
-
-.toolbar .toolbar-tray-vertical .toolbar-menu a {
-  padding-left: 2.75em; /* LTR */
-  padding-right: 4em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu a {
-  padding-left: 4em;
-  padding-right: 2.75em;
-}
-
-/**
- * Top level icons.
- */
-.toolbar-bar .toolbar-icon-menu:before {
-  background-image: url(../../../misc/icons/bebebe/hamburger.svg);
-}
-.toolbar-bar .toolbar-icon-menu:active:before,
-.toolbar-bar .toolbar-icon-menu.is-active:before {
-  background-image: url(../../../misc/icons/ffffff/hamburger.svg);
-}
-.toolbar-bar .toolbar-icon-help:before {
-  background-image: url(../../../misc/icons/bebebe/questionmark-disc.svg);
-}
-.toolbar-bar .toolbar-icon-help:active:before,
-.toolbar-bar .toolbar-icon-help.is-active:before {
-  background-image: url(../../../misc/icons/ffffff/questionmark-disc.svg);
-}
-
-/**
- * Main menu icons.
- */
-.toolbar-icon-system-admin-content:before {
-  background-image: url(../../../misc/icons/787878/file.svg);
-}
-.toolbar-icon-system-admin-content:active:before,
-.toolbar-icon-system-admin-content.is-active:before {
-  background-image: url(../../../misc/icons/000000/file.svg);
-}
-.toolbar-icon-system-admin-structure:before {
-  background-image: url(../../../misc/icons/787878/orgchart.svg);
-}
-.toolbar-icon-system-admin-structure:active:before,
-.toolbar-icon-system-admin-structure.is-active:before {
-  background-image: url(../../../misc/icons/000000/orgchart.svg);
-}
-.toolbar-icon-system-themes-page:before {
-  background-image: url(../../../misc/icons/787878/paintbrush.svg);
-}
-.toolbar-icon-system-themes-page:active:before,
-.toolbar-icon-system-themes-page.is-active:before {
-  background-image: url(../../../misc/icons/000000/paintbrush.svg);
-}
-.toolbar-icon-entity-user-collection:before {
-  background-image: url(../../../misc/icons/787878/people.svg);
-}
-.toolbar-icon-entity-user-collection:active:before,
-.toolbar-icon-entity-user-collection.is-active:before {
-  background-image: url(../../../misc/icons/000000/people.svg);
-}
-.toolbar-icon-system-modules-list:before {
-  background-image: url(../../../misc/icons/787878/puzzlepiece.svg);
-}
-.toolbar-icon-system-modules-list:active:before,
-.toolbar-icon-system-modules-list.is-active:before {
-  background-image: url(../../../misc/icons/000000/puzzlepiece.svg);
-}
-.toolbar-icon-system-admin-config:before {
-  background-image: url(../../../misc/icons/787878/wrench.svg);
-}
-.toolbar-icon-system-admin-config:active:before,
-.toolbar-icon-system-admin-config.is-active:before {
-  background-image: url(../../../misc/icons/000000/wrench.svg);
-}
-.toolbar-icon-system-admin-reports:before {
-  background-image: url(../../../misc/icons/787878/barchart.svg);
-}
-.toolbar-icon-system-admin-reports:active:before,
-.toolbar-icon-system-admin-reports.is-active:before {
-  background-image: url(../../../misc/icons/000000/barchart.svg);
-}
-.toolbar-icon-help-main:before {
-  background-image: url(../../../misc/icons/787878/questionmark-disc.svg);
-}
-.toolbar-icon-help-main:active:before,
-.toolbar-icon-help-main.is-active:before {
-  background-image: url(../../../misc/icons/000000/questionmark-disc.svg);
-}
-.toolbar .toolbar-bar .toolbar-icon:before {
-  min-height: 3em;
-}
-
-@media only screen and (min-width: 16.5em) {
-  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
-    margin-left: 0;
-    margin-right: 0;
-    padding-left: 0;
-    padding-right: 0;
-    text-indent: -9999px;
-    width: 4em;
-  }
-  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
-    background-size: 42% auto;
-    left: 0; /* LTR */
-    width: 100%;
-  }
-  .no-svg .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
-    background-size: auto auto;
-  }
-  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
-    left: auto;
-    right: 0;
-  }
-}
-
-@media only screen and (min-width: 36em) {
-  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
-    background-position: left center; /* LTR */
-    padding-left: 2.75em; /* LTR */
-    padding-right: 1.3333em; /* LTR */
-    text-indent: 0;
-    width: auto;
-  }
-  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
-    background-position: right center;
-    padding-left: 1.3333em;
-    padding-right: 2.75em;
-  }
-  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
-    background-size: 100% auto;
-    left: 0.6667em; /* LTR */
-    width: 20px;
-  }
-  .no-svg .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
-    background-size: auto auto;
-  }
-  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
-    left: 0;
-    right: 0.6667em;
-  }
-}
-
-/**
- *  Accessibility/focus
- */
-.toolbar-tab a:focus {
-  outline: none;
-  text-decoration: underline;
-}
-.toolbar-lining button:focus {
-  outline: none;
-}
-.toolbar-tray-horizontal a:focus,
-.toolbar-box a:focus {
-  outline: none;
-  background-color: #f5f5f5;
-}
-.toolbar-box a:hover:focus {
-  text-decoration: underline;
-}
-.toolbar .toolbar-icon.toolbar-handle:focus {
-  outline: none;
-  background-color: #f5f5f5;
-}
-
-
-/**
- * Handle.
- */
-.toolbar .toolbar-icon.toolbar-handle {
-  width: 4em;
-  text-indent: -9999px;
-}
-.toolbar .toolbar-icon.toolbar-handle:before {
-  left: 1.6667em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-icon.toolbar-handle:before {
-  left: auto;
-  right: 1.6667em;
-}
-.toolbar .toolbar-icon.toolbar-handle:before {
-  background-image: url(../../../misc/icons/5181c6/chevron-disc-down.svg);
-}
-.toolbar .toolbar-icon.toolbar-handle.open:before {
-  background-image: url(../../../misc/icons/787878/chevron-disc-up.svg);
-}
-.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle:before {
-  background-image: url(../../../misc/icons/5181c6/twistie-down.svg);
-  background-size: 75%;
-}
-.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle.open:before {
-  background-image: url(../../../misc/icons/787878/twistie-up.svg);
-  background-size: 75%;
-}
-.toolbar .toolbar-icon-escape-admin:before {
-  background-image: url(../../../misc/icons/bebebe/chevron-disc-left.svg);
-}
-[dir="rtl"] .toolbar .toolbar-icon-escape-admin:before {
-  background-image: url(../../../misc/icons/bebebe/chevron-disc-right.svg);
-}
-/**
- * Orientation toggle.
- */
-.toolbar .toolbar-toggle-orientation button {
-  height: 16px;
-  padding: 0;
-  text-indent: -999em;
-  width: 20px;
-}
-.toolbar .toolbar-toggle-orientation button:before {
-  left: 0; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-toggle-orientation button:before {
-  left: auto;
-  right: 0;
-}
-[dir="rtl"] .toolbar .toolbar-toggle-orientation .toolbar-icon {
-  padding-right: 0;
-}
-/**
- * In order to support a hover effect on the SVG images, while also supporting
- * RTL text direction and no SVG support, this little icon requires some very
- * specific targeting, setting and unsetting.
- */
-.toolbar .toolbar-toggle-orientation [value="vertical"]:before {
-  background-image: url(../../../misc/icons/bebebe/push-left.svg); /* LTR */
-}
-.toolbar .toolbar-toggle-orientation [value="vertical"]:hover:before,
-.toolbar .toolbar-toggle-orientation [value="vertical"]:focus:before
- {
-  background-image: url(../../../misc/icons/787878/push-left.svg); /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-toggle-orientation [value="vertical"]:before {
-  background-image: url(../../../misc/icons/bebebe/push-right.svg);
-}
-[dir="rtl"] .toolbar .toolbar-toggle-orientation [value="vertical"]:hover:before,
-[dir="rtl"] .toolbar .toolbar-toggle-orientation [value="vertical"]:focus:before {
-  background-image: url(../../../misc/icons/787878/push-right.svg);
-}
-.toolbar .toolbar-toggle-orientation [value="horizontal"]:before {
-  background-image: url(../../../misc/icons/bebebe/push-up.svg);
-}
-.toolbar .toolbar-toggle-orientation [value="horizontal"]:hover:before {
-  background-image: url(../../../misc/icons/787878/push-up.svg);
-}
-
diff --git a/core/modules/toolbar/css/toolbar.theme.css b/core/modules/toolbar/css/toolbar.theme.css
deleted file mode 100644
index a60e781..0000000
--- a/core/modules/toolbar/css/toolbar.theme.css
+++ /dev/null
@@ -1,168 +0,0 @@
-/**
- * @file toolbar.theme.css
- */
-.toolbar {
-  font-family: "Source Sans Pro", "Lucida Grande", Verdana, sans-serif;
-  /* Set base font size to 13px based on root ems. */
-  font-size: 0.8125rem;
-  -moz-tap-highlight-color: rgba(0,0,0,0);
-  -o-tap-highlight-color: rgba(0,0,0,0);
-  -webkit-tap-highlight-color: rgba(0,0,0,0);
-  tap-highlight-color: rgba(0,0,0,0);
-  -moz-touch-callout: none;
-  -o-touch-callout: none;
-  -webkit-touch-callout: none;
-  touch-callout: none;
-}
-.toolbar .toolbar-item {
-  cursor: pointer;
-  padding: 1em 1.3333em;
-  line-height: 1em;
-  text-decoration: none;
-}
-.toolbar .toolbar-item:hover, .toolbar .toolbar-item:focus {
-  text-decoration: underline;
-}
-
-/**
- * Toolbar bar.
- */
-.toolbar .toolbar-bar {
-  background-color: #0f0f0f;
-  box-shadow: -1px 0 3px 1px rgba(0, 0, 0, 0.3333); /* LTR */
-  color: #dddddd;
-}
-[dir="rtl"] .toolbar .toolbar-bar {
-  box-shadow: 1px 0 3px 1px rgba(0, 0, 0, 0.3333);
-}
-.toolbar .toolbar-bar .toolbar-item {
-  color: #ffffff;
-}
-.toolbar .toolbar-bar .toolbar-tab > .toolbar-item {
-  font-weight: bold;
-}
-.toolbar .toolbar-bar .toolbar-tab > .toolbar-item:hover,
-.toolbar .toolbar-bar .toolbar-tab > .toolbar-item:focus {
-  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%);
-  background-image: linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%);
-}
-.toolbar .toolbar-bar .toolbar-tab > .toolbar-item.is-active {
-  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%);
-  background-image: linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%);
-}
-
-/**
- * Toolbar tray.
- */
-.toolbar .toolbar-tray {
-  background-color: #ffffff;
-}
-.toolbar .toolbar-tray-horizontal > .toolbar-lining {
-  padding-right: 5em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-horizontal > .toolbar-lining {
-  padding-right: 0;
-  padding-left: 5em;
-}
-.toolbar .toolbar-tray-vertical {
-  background-color: #f5f5f5;
-  border-right: 1px solid #aaaaaa; /* LTR */
-  box-shadow: -1px 0 5px 2px rgba(0, 0, 0, 0.3333); /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-vertical {
-  border-left: 1px solid #aaaaaa;
-  border-right: 0 none;
-  box-shadow: 1px 0 5px 2px rgba(0, 0, 0, 0.3333);
-}
-.toolbar .toolbar-tray-horizontal {
-  border-bottom: 1px solid #aaaaaa;
-  box-shadow: -2px 1px 3px 1px rgba(0, 0, 0, 0.3333); /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-horizontal {
-  box-shadow: 2px 1px 3px 1px rgba(0, 0, 0, 0.3333);
-}
-.toolbar .toolbar-tray-horizontal .toolbar-tray {
-  background-color: #f5f5f5;
-}
-.toolbar-tray a {
-  color: #565656;
-  cursor: pointer;
-  padding: 1em 1.3333em;
-  text-decoration: none;
-}
-.toolbar-tray a:hover,
-.toolbar-tray a:active,
-.toolbar-tray a:focus,
-.toolbar-tray a.is-active
- {
-  color: #000;
-  text-decoration: underline;
-}
-.toolbar .toolbar-menu {
-  background-color: #ffffff;
-}
-.toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
-  border-left: 1px solid #dddddd; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
-  border-left: 0 none ;
-  border-right: 1px solid #dddddd;
-}
-.toolbar .toolbar-tray-horizontal .menu-item:last-child {
-  border-right: 1px solid #dddddd; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-horizontal .menu-item:last-child {
-  border-left: 1px solid #dddddd;
-}
-.toolbar .toolbar-tray-vertical .menu-item + .menu-item {
-  border-top: 1px solid #dddddd;
-}
-.toolbar .toolbar-tray-vertical .menu-item:last-child {
-  border-bottom: 1px solid #dddddd;
-}
-.toolbar .toolbar-tray-vertical .menu-item .menu-item {
-  border: 0 none;
-}
-.toolbar .toolbar-tray-vertical .toolbar-menu ul ul {
-  border-bottom: 1px solid #dddddd;
-  border-top: 1px solid #dddddd;
-}
-.toolbar .toolbar-tray-vertical .menu-item:last-child > ul {
-  border-bottom: 0;
-}
-.toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu {
-  margin-left: 0.25em; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu {
-  margin-left: 0;
-  margin-right: 0.25em;
-}
-.toolbar .toolbar-menu .toolbar-menu a {
-  color: #434343;
-}
-
-/**
- * Orientation toggle.
- */
-.toolbar .toolbar-toggle-orientation {
-  background-color: #f5f5f5;
-  padding: 0.6667em;
-}
-.toolbar .toolbar-tray-horizontal .toolbar-toggle-orientation {
-  border-left: 1px solid #c9c9c9; /* LTR */
-}
-[dir="rtl"] .toolbar .toolbar-tray-horizontal .toolbar-toggle-orientation {
-  border-left: 0 none;
-  border-right: 1px solid #c9c9c9;
-}
-.toolbar .toolbar-toggle-orientation > .toolbar-lining {
-  float: right; /* LTR */
-  padding: 0.1667em;
-}
-[dir="rtl"] .toolbar .toolbar-toggle-orientation > .toolbar-lining {
-  float: left;
-}
-.toolbar .toolbar-toggle-orientation button {
-  cursor: pointer;
-  display: inline-block;
-}
diff --git a/core/modules/toolbar/toolbar.libraries.yml b/core/modules/toolbar/toolbar.libraries.yml
index dcef084..334d275 100644
--- a/core/modules/toolbar/toolbar.libraries.yml
+++ b/core/modules/toolbar/toolbar.libraries.yml
@@ -14,9 +14,6 @@ toolbar:
   css:
     component:
       css/toolbar.module.css: {}
-    theme:
-      css/toolbar.theme.css: {}
-      css/toolbar.icons.theme.css: {}
   dependencies:
     - core/modernizr
     - core/jquery
diff --git a/core/modules/toolbar/toolbar.module b/core/modules/toolbar/toolbar.module
index ccf1f9c..d843b22 100644
--- a/core/modules/toolbar/toolbar.module
+++ b/core/modules/toolbar/toolbar.module
@@ -349,3 +349,44 @@ function _toolbar_get_subtrees_hash() {
   $hash = Crypt::hashBase64(serialize($subtrees));
   return [$hash, $cacheability];
 }
+
+/**
+ * Implements hook_library_info_alter().
+ *
+ * Includes additional stylesheets defined by the admin theme to allow it to
+ * customize the Administration toolbar appearance.
+ *
+ * An admin theme can specify CSS files to make the front-end administration
+ * experience of in-place editing match the administration experience in the
+ * back-end.
+ *
+ * The CSS files can be specified via the "toolbar_stylesheets" property in the
+ * .info.yml file:
+ * @code
+ * toolbar_stylesheets:
+ *   - css/toolbar.css
+ * @endcode
+ */
+function toolbar_library_info_alter(&$libraries, $extension) {
+  if ($extension === 'toolbar' && isset($libraries['toolbar'])) {
+    $theme = Drupal::config('system.theme')->get('admin');
+
+    // First let the base theme modify the library, then the actual theme.
+    $alter_library = function(&$library, $theme) use (&$alter_library) {
+      if (isset($theme) && $theme_path = drupal_get_path('theme', $theme)) {
+        $info = system_get_info('theme', $theme);
+        // Recurse to process base theme(s) first.
+        if (isset($info['base theme'])) {
+          $alter_library($library, $info['base theme']);
+        }
+        if (isset($info['toolbar_stylesheets'])) {
+          foreach ($info['toolbar_stylesheets'] as $path) {
+            $library['css']['theme']['/' . $theme_path . '/' . $path] = [];
+          }
+        }
+      }
+    };
+
+    $alter_library($libraries['toolbar'], $theme);
+  }
+}
diff --git a/core/themes/seven/css/components/toolbar.css b/core/themes/seven/css/components/toolbar.css
new file mode 100644
index 0000000..5876e56
--- /dev/null
+++ b/core/themes/seven/css/components/toolbar.css
@@ -0,0 +1,169 @@
+/**
+ * @file toolbar.css
+ * Visual styling for the administration toolbar.
+ */
+.toolbar {
+  font-family: "Source Sans Pro", "Lucida Grande", Verdana, sans-serif;
+  /* Set base font size to 13px based on root ems. */
+  font-size: 0.8125rem;
+  -moz-tap-highlight-color: rgba(0,0,0,0);
+  -o-tap-highlight-color: rgba(0,0,0,0);
+  -webkit-tap-highlight-color: rgba(0,0,0,0);
+  tap-highlight-color: rgba(0,0,0,0);
+  -moz-touch-callout: none;
+  -o-touch-callout: none;
+  -webkit-touch-callout: none;
+  touch-callout: none;
+}
+.toolbar .toolbar-item {
+  cursor: pointer;
+  padding: 1em 1.3333em;
+  line-height: 1em;
+  text-decoration: none;
+}
+.toolbar .toolbar-item:hover, .toolbar .toolbar-item:focus {
+  text-decoration: underline;
+}
+
+/**
+ * Toolbar bar.
+ */
+.toolbar .toolbar-bar {
+  background-color: #0f0f0f;
+  box-shadow: -1px 0 3px 1px rgba(0, 0, 0, 0.3333); /* LTR */
+  color: #dddddd;
+}
+[dir="rtl"] .toolbar .toolbar-bar {
+  box-shadow: 1px 0 3px 1px rgba(0, 0, 0, 0.3333);
+}
+.toolbar .toolbar-bar .toolbar-item {
+  color: #ffffff;
+}
+.toolbar .toolbar-bar .toolbar-tab > .toolbar-item {
+  font-weight: bold;
+}
+.toolbar .toolbar-bar .toolbar-tab > .toolbar-item:hover,
+.toolbar .toolbar-bar .toolbar-tab > .toolbar-item:focus {
+  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%);
+  background-image: linear-gradient(rgba(255, 255, 255, 0.125) 20%, transparent 200%);
+}
+.toolbar .toolbar-bar .toolbar-tab > .toolbar-item.is-active {
+  background-image: -webkit-linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%);
+  background-image: linear-gradient(rgba(255, 255, 255, 0.25) 20%, transparent 200%);
+}
+
+/**
+ * Toolbar tray.
+ */
+.toolbar .toolbar-tray {
+  background-color: #ffffff;
+}
+.toolbar .toolbar-tray-horizontal > .toolbar-lining {
+  padding-right: 5em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-horizontal > .toolbar-lining {
+  padding-right: 0;
+  padding-left: 5em;
+}
+.toolbar .toolbar-tray-vertical {
+  background-color: #f5f5f5;
+  border-right: 1px solid #aaaaaa; /* LTR */
+  box-shadow: -1px 0 5px 2px rgba(0, 0, 0, 0.3333); /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-vertical {
+  border-left: 1px solid #aaaaaa;
+  border-right: 0 none;
+  box-shadow: 1px 0 5px 2px rgba(0, 0, 0, 0.3333);
+}
+.toolbar .toolbar-tray-horizontal {
+  border-bottom: 1px solid #aaaaaa;
+  box-shadow: -2px 1px 3px 1px rgba(0, 0, 0, 0.3333); /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-horizontal {
+  box-shadow: 2px 1px 3px 1px rgba(0, 0, 0, 0.3333);
+}
+.toolbar .toolbar-tray-horizontal .toolbar-tray {
+  background-color: #f5f5f5;
+}
+.toolbar-tray a {
+  color: #565656;
+  cursor: pointer;
+  padding: 1em 1.3333em;
+  text-decoration: none;
+}
+.toolbar-tray a:hover,
+.toolbar-tray a:active,
+.toolbar-tray a:focus,
+.toolbar-tray a.is-active
+ {
+  color: #000;
+  text-decoration: underline;
+}
+.toolbar .toolbar-menu {
+  background-color: #ffffff;
+}
+.toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
+  border-left: 1px solid #dddddd; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
+  border-left: 0 none ;
+  border-right: 1px solid #dddddd;
+}
+.toolbar .toolbar-tray-horizontal .menu-item:last-child {
+  border-right: 1px solid #dddddd; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-horizontal .menu-item:last-child {
+  border-left: 1px solid #dddddd;
+}
+.toolbar .toolbar-tray-vertical .menu-item + .menu-item {
+  border-top: 1px solid #dddddd;
+}
+.toolbar .toolbar-tray-vertical .menu-item:last-child {
+  border-bottom: 1px solid #dddddd;
+}
+.toolbar .toolbar-tray-vertical .menu-item .menu-item {
+  border: 0 none;
+}
+.toolbar .toolbar-tray-vertical .toolbar-menu ul ul {
+  border-bottom: 1px solid #dddddd;
+  border-top: 1px solid #dddddd;
+}
+.toolbar .toolbar-tray-vertical .menu-item:last-child > ul {
+  border-bottom: 0;
+}
+.toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu {
+  margin-left: 0.25em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu {
+  margin-left: 0;
+  margin-right: 0.25em;
+}
+.toolbar .toolbar-menu .toolbar-menu a {
+  color: #434343;
+}
+
+/**
+ * Orientation toggle.
+ */
+.toolbar .toolbar-toggle-orientation {
+  background-color: #f5f5f5;
+  padding: 0.6667em;
+}
+.toolbar .toolbar-tray-horizontal .toolbar-toggle-orientation {
+  border-left: 1px solid #c9c9c9; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-horizontal .toolbar-toggle-orientation {
+  border-left: 0 none;
+  border-right: 1px solid #c9c9c9;
+}
+.toolbar .toolbar-toggle-orientation > .toolbar-lining {
+  float: right; /* LTR */
+  padding: 0.1667em;
+}
+[dir="rtl"] .toolbar .toolbar-toggle-orientation > .toolbar-lining {
+  float: left;
+}
+.toolbar .toolbar-toggle-orientation button {
+  cursor: pointer;
+  display: inline-block;
+}
diff --git a/core/themes/seven/css/components/toolbar.icons.css b/core/themes/seven/css/components/toolbar.icons.css
new file mode 100644
index 0000000..4d31885
--- /dev/null
+++ b/core/themes/seven/css/components/toolbar.icons.css
@@ -0,0 +1,305 @@
+/**
+ * @file
+ * Styling for toolbar module icons.
+ */
+
+.toolbar .toolbar-icon {
+  padding-left: 2.75em; /* LTR */
+  position: relative;
+}
+[dir="rtl"] .toolbar .toolbar-icon {
+  padding-left: 1.3333em;
+  padding-right: 2.75em;
+}
+.toolbar .toolbar-icon:before {
+  background-attachment: scroll;
+  background-color: transparent;
+  background-position: center center;
+  background-repeat: no-repeat;
+  background-size: 100% auto;
+  content: '';
+  display: block;
+  height: 100%;
+  left: 0.6667em; /* LTR */
+  position: absolute;
+  top: 0;
+  width: 20px;
+}
+[dir="rtl"] .toolbar .toolbar-icon:before {
+  left: auto;
+  right: 0.6667em;
+}
+.toolbar button.toolbar-icon {
+  background-color: transparent;
+  border: 0;
+  font-size: 1em;
+}
+.toolbar .toolbar-menu ul .toolbar-icon {
+  padding-left: 1.3333em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-menu ul .toolbar-icon {
+  padding-left: 0;
+  padding-right: 1.3333em;
+}
+.toolbar .toolbar-menu ul a.toolbar-icon:before {
+  display: none;
+}
+.toolbar .toolbar-tray-vertical .toolbar-menu ul a {
+  padding-left: 2.75em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul a {
+  padding-left: 0;
+  padding-right: 2.75em;
+}
+.toolbar .toolbar-tray-vertical .toolbar-menu ul ul a {
+  padding-left: 3.75em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul ul a {
+  padding-left: 0;
+  padding-right: 3.75em;
+}
+
+.toolbar .toolbar-tray-vertical .toolbar-menu a {
+  padding-left: 2.75em; /* LTR */
+  padding-right: 4em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu a {
+  padding-left: 4em;
+  padding-right: 2.75em;
+}
+
+/**
+ * Top level icons.
+ */
+.toolbar-bar .toolbar-icon-menu:before {
+  background-image: url(../../../../misc/icons/bebebe/hamburger.svg);
+}
+.toolbar-bar .toolbar-icon-menu:active:before,
+.toolbar-bar .toolbar-icon-menu.is-active:before {
+  background-image: url(../../../../misc/icons/ffffff/hamburger.svg);
+}
+.toolbar-bar .toolbar-icon-help:before {
+  background-image: url(../../../../misc/icons/bebebe/questionmark-disc.svg);
+}
+.toolbar-bar .toolbar-icon-help:active:before,
+.toolbar-bar .toolbar-icon-help.is-active:before {
+  background-image: url(../../../../misc/icons/ffffff/questionmark-disc.svg);
+}
+
+/**
+ * Main menu icons.
+ */
+.toolbar-icon-system-admin-content:before {
+  background-image: url(../../../../misc/icons/787878/file.svg);
+}
+.toolbar-icon-system-admin-content:active:before,
+.toolbar-icon-system-admin-content.is-active:before {
+  background-image: url(../../../../misc/icons/000000/file.svg);
+}
+.toolbar-icon-system-admin-structure:before {
+  background-image: url(../../../../misc/icons/787878/orgchart.svg);
+}
+.toolbar-icon-system-admin-structure:active:before,
+.toolbar-icon-system-admin-structure.is-active:before {
+  background-image: url(../../../../misc/icons/000000/orgchart.svg);
+}
+.toolbar-icon-system-themes-page:before {
+  background-image: url(../../../../misc/icons/787878/paintbrush.svg);
+}
+.toolbar-icon-system-themes-page:active:before,
+.toolbar-icon-system-themes-page.is-active:before {
+  background-image: url(../../../../misc/icons/000000/paintbrush.svg);
+}
+.toolbar-icon-entity-user-collection:before {
+  background-image: url(../../../../misc/icons/787878/people.svg);
+}
+.toolbar-icon-entity-user-collection:active:before,
+.toolbar-icon-entity-user-collection.is-active:before {
+  background-image: url(../../../../misc/icons/000000/people.svg);
+}
+.toolbar-icon-system-modules-list:before {
+  background-image: url(../../../../misc/icons/787878/puzzlepiece.svg);
+}
+.toolbar-icon-system-modules-list:active:before,
+.toolbar-icon-system-modules-list.is-active:before {
+  background-image: url(../../../../misc/icons/000000/puzzlepiece.svg);
+}
+.toolbar-icon-system-admin-config:before {
+  background-image: url(../../../../misc/icons/787878/wrench.svg);
+}
+.toolbar-icon-system-admin-config:active:before,
+.toolbar-icon-system-admin-config.is-active:before {
+  background-image: url(../../../../misc/icons/000000/wrench.svg);
+}
+.toolbar-icon-system-admin-reports:before {
+  background-image: url(../../../../misc/icons/787878/barchart.svg);
+}
+.toolbar-icon-system-admin-reports:active:before,
+.toolbar-icon-system-admin-reports.is-active:before {
+  background-image: url(../../../../misc/icons/000000/barchart.svg);
+}
+.toolbar-icon-help-main:before {
+  background-image: url(../../../../misc/icons/787878/questionmark-disc.svg);
+}
+.toolbar-icon-help-main:active:before,
+.toolbar-icon-help-main.is-active:before {
+  background-image: url(../../../../misc/icons/000000/questionmark-disc.svg);
+}
+.toolbar .toolbar-bar .toolbar-icon:before {
+  min-height: 3em;
+}
+
+@media only screen and (min-width: 16.5em) {
+  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
+    margin-left: 0;
+    margin-right: 0;
+    padding-left: 0;
+    padding-right: 0;
+    text-indent: -9999px;
+    width: 4em;
+  }
+  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
+    background-size: 42% auto;
+    left: 0; /* LTR */
+    width: 100%;
+  }
+  .no-svg .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
+    background-size: auto auto;
+  }
+  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
+    left: auto;
+    right: 0;
+  }
+}
+
+@media only screen and (min-width: 36em) {
+  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
+    background-position: left center; /* LTR */
+    padding-left: 2.75em; /* LTR */
+    padding-right: 1.3333em; /* LTR */
+    text-indent: 0;
+    width: auto;
+  }
+  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon {
+    background-position: right center;
+    padding-left: 1.3333em;
+    padding-right: 2.75em;
+  }
+  .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
+    background-size: 100% auto;
+    left: 0.6667em; /* LTR */
+    width: 20px;
+  }
+  .no-svg .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
+    background-size: auto auto;
+  }
+  [dir="rtl"] .toolbar .toolbar-bar .toolbar-tab > .toolbar-icon:before {
+    left: 0;
+    right: 0.6667em;
+  }
+}
+
+/**
+ *  Accessibility/focus
+ */
+.toolbar-tab a:focus {
+  outline: none;
+  text-decoration: underline;
+}
+.toolbar-lining button:focus {
+  outline: none;
+}
+.toolbar-tray-horizontal a:focus,
+.toolbar-box a:focus {
+  outline: none;
+  background-color: #f5f5f5;
+}
+.toolbar-box a:hover:focus {
+  text-decoration: underline;
+}
+.toolbar .toolbar-icon.toolbar-handle:focus {
+  outline: none;
+  background-color: #f5f5f5;
+}
+
+
+/**
+ * Handle.
+ */
+.toolbar .toolbar-icon.toolbar-handle {
+  width: 4em;
+  text-indent: -9999px;
+}
+.toolbar .toolbar-icon.toolbar-handle:before {
+  left: 1.6667em; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-icon.toolbar-handle:before {
+  left: auto;
+  right: 1.6667em;
+}
+.toolbar .toolbar-icon.toolbar-handle:before {
+  background-image: url(../../../../misc/icons/5181c6/chevron-disc-down.svg);
+}
+.toolbar .toolbar-icon.toolbar-handle.open:before {
+  background-image: url(../../../../misc/icons/787878/chevron-disc-up.svg);
+}
+.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle:before {
+  background-image: url(../../../../misc/icons/5181c6/twistie-down.svg);
+  background-size: 75%;
+}
+.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle.open:before {
+  background-image: url(../../../../misc/icons/787878/twistie-up.svg);
+  background-size: 75%;
+}
+.toolbar .toolbar-icon-escape-admin:before {
+  background-image: url(../../../../misc/icons/bebebe/chevron-disc-left.svg);
+}
+[dir="rtl"] .toolbar .toolbar-icon-escape-admin:before {
+  background-image: url(../../../../misc/icons/bebebe/chevron-disc-right.svg);
+}
+/**
+ * Orientation toggle.
+ */
+.toolbar .toolbar-toggle-orientation button {
+  height: 16px;
+  padding: 0;
+  text-indent: -999em;
+  width: 20px;
+}
+.toolbar .toolbar-toggle-orientation button:before {
+  left: 0; /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-toggle-orientation button:before {
+  left: auto;
+  right: 0;
+}
+[dir="rtl"] .toolbar .toolbar-toggle-orientation .toolbar-icon {
+  padding-right: 0;
+}
+/**
+ * In order to support a hover effect on the SVG images, while also supporting
+ * RTL text direction and no SVG support, this little icon requires some very
+ * specific targeting, setting and unsetting.
+ */
+.toolbar .toolbar-toggle-orientation [value="vertical"]:before {
+  background-image: url(../../../../misc/icons/bebebe/push-left.svg); /* LTR */
+}
+.toolbar .toolbar-toggle-orientation [value="vertical"]:hover:before,
+.toolbar .toolbar-toggle-orientation [value="vertical"]:focus:before
+ {
+  background-image: url(../../../../misc/icons/787878/push-left.svg); /* LTR */
+}
+[dir="rtl"] .toolbar .toolbar-toggle-orientation [value="vertical"]:before {
+  background-image: url(../../../../misc/icons/bebebe/push-right.svg);
+}
+[dir="rtl"] .toolbar .toolbar-toggle-orientation [value="vertical"]:hover:before,
+[dir="rtl"] .toolbar .toolbar-toggle-orientation [value="vertical"]:focus:before {
+  background-image: url(../../../../misc/icons/787878/push-right.svg);
+}
+.toolbar .toolbar-toggle-orientation [value="horizontal"]:before {
+  background-image: url(../../../../misc/icons/bebebe/push-up.svg);
+}
+.toolbar .toolbar-toggle-orientation [value="horizontal"]:hover:before {
+  background-image: url(../../../../misc/icons/787878/push-up.svg);
+}
+
diff --git a/core/themes/seven/seven.info.yml b/core/themes/seven/seven.info.yml
index b0911be..ea0ff64 100644
--- a/core/themes/seven/seven.info.yml
+++ b/core/themes/seven/seven.info.yml
@@ -12,6 +12,9 @@ stylesheets-remove:
   - core/assets/vendor/jquery.ui/themes/base/dialog.css
 quickedit_stylesheets:
   - css/components/quickedit.css
+toolbar_stylesheets:
+  - css/components/toolbar.css
+  - css/components/toolbar.icons.css
 regions:
   header: 'Header'
   pre_content: 'Pre-content'