diff --git a/core/modules/shortcut/shortcut.module b/core/modules/shortcut/shortcut.module
index 9f34466..e4b44f6 100644
--- a/core/modules/shortcut/shortcut.module
+++ b/core/modules/shortcut/shortcut.module
@@ -276,7 +276,7 @@ function shortcut_renderable_links($shortcut_set = NULL) {
       '#theme' => 'links__toolbar_shortcuts',
       '#links' => $links,
       '#attributes' => array(
-        'class' => array('menu'),
+        'class' => array('toolbar-menu'),
       ),
       '#cache' => array(
         'tags' => $cache_tags,
diff --git a/core/modules/shortcut/src/Tests/ShortcutLinksTest.php b/core/modules/shortcut/src/Tests/ShortcutLinksTest.php
index a59e5d5..08c4a82 100644
--- a/core/modules/shortcut/src/Tests/ShortcutLinksTest.php
+++ b/core/modules/shortcut/src/Tests/ShortcutLinksTest.php
@@ -286,14 +286,14 @@ public function testShortcutLinkOrder() {
     // Ensure to give permissions to access the shortcuts.
     $this->drupalLogin($this->drupalCreateUser(array('access toolbar', 'access shortcuts', 'access content overview', 'administer content types')));
     $this->drupalGet(Url::fromRoute('<front>'));
-    $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .menu a');
+    $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .toolbar-menu a');
     $this->assertEqual((string) $shortcuts[0], 'Add content');
     $this->assertEqual((string) $shortcuts[1], 'All content');
     foreach($this->set->getShortcuts() as $shortcut) {
       $shortcut->setWeight($shortcut->getWeight() * -1)->save();
     }
     $this->drupalGet(Url::fromRoute('<front>'));
-    $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .menu a');
+    $shortcuts = $this->cssSelect('#toolbar-item-shortcuts-tray .toolbar-menu a');
     $this->assertEqual((string) $shortcuts[0], 'All content');
     $this->assertEqual((string) $shortcuts[1], 'Add content');
   }
diff --git a/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php b/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php
index 9f81cb5..b188756 100644
--- a/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php
+++ b/core/modules/shortcut/src/Tests/ShortcutTranslationUITest.php
@@ -73,7 +73,7 @@ protected function doTestBasicTranslation() {
         $this->drupalGet('<front>', array('language' => $language));
         $expected_path = \Drupal::urlGenerator()->generateFromRoute('user.page', array(), array('language' => $language));
         $label = $entity->getTranslation($langcode)->label();
-        $elements = $this->xpath('//nav[contains(@class, "toolbar-lining")]/ul[@class="menu"]/li/a[contains(@href, :href) and normalize-space(text())=:label]', array(':href' => $expected_path, ':label' => $label));
+        $elements = $this->xpath('//nav[contains(@class, "toolbar-lining")]/ul[@class="toolbar-menu"]/li/a[contains(@href, :href) and normalize-space(text())=:label]', array(':href' => $expected_path, ':label' => $label));
         $this->assertTrue(!empty($elements), format_string('Translated @language shortcut link @label found.', array('@label' => $label, '@language' => $language->getName())));
       }
     }
diff --git a/core/modules/toolbar/css/toolbar.icons.theme.css b/core/modules/toolbar/css/toolbar.icons.theme.css
index 3f274f3..1eb1904 100644
--- a/core/modules/toolbar/css/toolbar.icons.theme.css
+++ b/core/modules/toolbar/css/toolbar.icons.theme.css
@@ -34,27 +34,27 @@
   border: 0;
   font-size: 1em;
 }
-.toolbar .menu ul .toolbar-icon {
+.toolbar .toolbar-menu ul .toolbar-icon {
   padding-left: 1.3333em; /* LTR */
 }
-[dir="rtl"] .toolbar .menu ul .toolbar-icon {
+[dir="rtl"] .toolbar .toolbar-menu ul .toolbar-icon {
   padding-left: 0;
   padding-right: 1.3333em;
 }
-.toolbar .menu ul a.toolbar-icon:before {
+.toolbar .toolbar-menu ul a.toolbar-icon:before {
   display: none;
 }
-.toolbar .toolbar-tray-vertical .menu ul a {
+.toolbar .toolbar-tray-vertical .toolbar-menu ul a {
   padding-left: 2.75em; /* LTR */
 }
-[dir="rtl"] .toolbar .toolbar-tray-vertical .menu ul a {
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul a {
   padding-left: 0;
   padding-right: 2.75em;
 }
-.toolbar .toolbar-tray-vertical .menu ul ul a {
+.toolbar .toolbar-tray-vertical .toolbar-menu ul ul a {
   padding-left: 3.75em; /* LTR */
 }
-[dir="rtl"] .toolbar .toolbar-tray-vertical .menu ul ul a {
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu ul ul a {
   padding-left: 0;
   padding-right: 3.75em;
 }
@@ -255,11 +255,11 @@
 .toolbar .toolbar-icon.toolbar-handle.open:before {
   background-image: url(../../../misc/icons/787878/chevron-disc-up.svg);
 }
-.toolbar .menu .menu .toolbar-icon.toolbar-handle:before {
+.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle:before {
   background-image: url(../../../misc/icons/5181c6/twistie-down.svg);
   background-size: 75%;
 }
-.toolbar .menu .menu .toolbar-icon.toolbar-handle.open:before {
+.toolbar .toolbar-menu .toolbar-menu .toolbar-icon.toolbar-handle.open:before {
   background-image: url(../../../misc/icons/787878/twistie-up.svg);
   background-size: 75%;
 }
diff --git a/core/modules/toolbar/css/toolbar.menu.css b/core/modules/toolbar/css/toolbar.menu.css
index e857beb..febc088 100644
--- a/core/modules/toolbar/css/toolbar.menu.css
+++ b/core/modules/toolbar/css/toolbar.menu.css
@@ -1,8 +1,8 @@
 /**
  * @file toolbar.menu.css
  */
-.toolbar .menu,
-[dir="rtl"] .toolbar .menu {
+.toolbar .toolbar-menu,
+[dir="rtl"] .toolbar .toolbar-menu {
   list-style: none;
   margin: 0;
   padding: 0;
@@ -13,9 +13,12 @@
   position: relative;
   width: auto;
 }
-.toolbar .toolbar-tray-horizontal .menu .toolbar-handle,
-.toolbar .toolbar-tray-horizontal .menu ul,
-.toolbar .toolbar-tray-vertical .menu ul {
+.toolbar .toolbar-tray-horizontal .toolbar-menu .toolbar-handle,
+.toolbar .toolbar-tray-horizontal .toolar-menu ul,
+.toolbar .toolbar-tray-vertical .toolbar-menu ul {
+.toolbar .toolbar-box a {
+  display: inline-block;
+}
   display: none;
 }
 .toolbar .toolbar-tray-vertical li.open > ul {
diff --git a/core/modules/toolbar/css/toolbar.theme.css b/core/modules/toolbar/css/toolbar.theme.css
index 8946e5f..09ac9c9 100644
--- a/core/modules/toolbar/css/toolbar.theme.css
+++ b/core/modules/toolbar/css/toolbar.theme.css
@@ -99,7 +99,7 @@
   color: #000;
   text-decoration: underline;
 }
-.toolbar .menu {
+.toolbar .toolbar-menu {
   background-color: #ffffff;
 }
 .toolbar .toolbar-tray-horizontal .menu-item + .menu-item {
@@ -124,21 +124,21 @@
 .toolbar .toolbar-tray-vertical .menu-item .menu-item {
   border: 0 none;
 }
-.toolbar .toolbar-tray-vertical .menu ul ul {
+.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 .menu .menu .menu .menu {
+.toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu {
   margin-left: 0.25em; /* LTR */
 }
-[dir="rtl"] .toolbar .toolbar-tray-vertical .menu .menu .menu .menu {
+[dir="rtl"] .toolbar .toolbar-tray-vertical .toolbar-menu .toolbar-menu .toolbar-menu .toolbar-menu {
   margin-left: 0;
   margin-right: 0.25em;
 }
-.toolbar .menu .menu a {
+.toolbar .toolbar-menu .toolbar-menu a {
   color: #434343;
 }
 
diff --git a/core/modules/toolbar/js/toolbar.menu.js b/core/modules/toolbar/js/toolbar.menu.js
index c14d0d4..e590297 100644
--- a/core/modules/toolbar/js/toolbar.menu.js
+++ b/core/modules/toolbar/js/toolbar.menu.js
@@ -2,7 +2,7 @@
  * Builds a nested accordion widget.
  *
  * Invoke on an HTML list element with the jQuery plugin pattern.
- * - For example, $('.menu').drupalToolbarMenu();
+ * - For example, $('.toolbar-menu').drupalToolbarMenu();
  */
 
 (function ($, Drupal, drupalSettings) {
@@ -103,7 +103,7 @@
       // Add a handle to each list item if it has a menu.
       $menu.find('li').each(function (index, element) {
         var $item = $(element);
-        if ($item.children('ul.menu').length) {
+        if ($item.children('ul.toolbar-menu').length) {
           var $box = $item.children('.toolbar-box');
           options.text = Drupal.t('@label', {'@label': $box.find('a').text()});
           $item.children('.toolbar-box')
diff --git a/core/modules/toolbar/js/views/MenuVisualView.js b/core/modules/toolbar/js/views/MenuVisualView.js
index d90b6d0..917259b 100644
--- a/core/modules/toolbar/js/views/MenuVisualView.js
+++ b/core/modules/toolbar/js/views/MenuVisualView.js
@@ -35,7 +35,7 @@
       // Render the main menu as a nested, collapsible accordion.
       if ('drupalToolbarMenu' in $.fn) {
         this.$el
-          .children('.menu')
+          .children('.toolbar-menu')
           .drupalToolbarMenu();
       }
     }
diff --git a/core/modules/toolbar/templates/toolbar-menu.html.twig b/core/modules/toolbar/templates/toolbar-menu.html.twig
new file mode 100644
index 0000000..3578b95
--- /dev/null
+++ b/core/modules/toolbar/templates/toolbar-menu.html.twig
@@ -0,0 +1,44 @@
+{#
+/**
+ * @file
+ * Default theme implementation to display a toolbar menu.
+ *
+ * Available variables:
+ * - menu_name: The machine name of the menu.
+ * - items: A nested list of menu items. Each menu item contains:
+ *   - attributes: HTML attributes for the menu item.
+ *   - below: The menu item child items.
+ *   - title: The menu link title.
+ *   - url: The menu link url, instance of \Drupal\Core\Url
+ *   - localized_options: Menu link localized options.
+ *
+ * @ingroup themeable
+ */
+#}
+{% import _self as menus %}
+
+{#
+  We call a macro which calls itself to render the full tree.
+  @see http://twig.sensiolabs.org/doc/tags/macro.html
+#}
+{{ menus.menu_links(items, attributes, 0) }}
+
+{% macro menu_links(items, attributes, menu_level) %}
+  {% import _self as menus %}
+  {% if items %}
+    {% if menu_level == 0 %}
+      <ul{{ attributes.addClass('toolbar-menu') }}>
+    {% else %}
+      <ul class="toolbar-menu">
+    {% endif %}
+      {% for item in items %}
+        <li{{ item.attributes }}>
+          {{ link(item.title, item.url) }}
+          {% if item.below %}
+            {{ menus.menu_links(item.below, attributes, menu_level + 1) }}
+          {% endif %}
+        </li>
+      {% endfor %}
+    </ul>
+  {% endif %}
+{% endmacro %}
diff --git a/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module b/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module
index 9d4e89f..25c1c47 100644
--- a/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module
+++ b/core/modules/toolbar/tests/modules/toolbar_test/toolbar_test.module
@@ -39,7 +39,7 @@ function toolbar_test_toolbar() {
           \Drupal::l(t('link 3'), new Url('<front>', [], array('attributes' => array('title' => 'Test link 3 title')))),
         ),
         '#attributes' => array(
-          'class' => array('menu'),
+          'class' => array('toolbar-menu'),
         ),
       ),
     ),
diff --git a/core/modules/toolbar/toolbar.module b/core/modules/toolbar/toolbar.module
index 50704d0..f9af4f2 100644
--- a/core/modules/toolbar/toolbar.module
+++ b/core/modules/toolbar/toolbar.module
@@ -42,6 +42,10 @@ function toolbar_theme($existing, $type, $theme, $path) {
   $items['toolbar'] = array(
     'render element' => 'element',
   );
+  $items['menu__admin'] = array(
+    'variables' => array('items' => array(), 'attributes' => array()),
+    'template' => 'toolbar-menu',
+  );
 
   return $items;
 }
diff --git a/core/modules/user/user.module b/core/modules/user/user.module
index 10c5809..51dfde3 100644
--- a/core/modules/user/user.module
+++ b/core/modules/user/user.module
@@ -1421,7 +1421,7 @@ function user_toolbar() {
         '#theme' => 'links__toolbar_user',
         '#links' => $links,
         '#attributes' => array(
-          'class' => array('menu'),
+          'class' => array('toolbar-menu'),
         ),
       ),
     ),