diff --git a/core/modules/system/css/system.admin.css b/core/modules/system/css/system.admin.css
index 7f23aab..b60ce8c 100644
--- a/core/modules/system/css/system.admin.css
+++ b/core/modules/system/css/system.admin.css
@@ -45,13 +45,13 @@
 }
 
 /**
- * Administration blocks.
+ * Panel.
+ * Used to visually group items together.
  */
-.admin-panel {
-  margin: 0;
-  padding: 5px 5px 15px 5px;
+.panel {
+  padding: 5px 5px 15px;
 }
-.admin-panel .description {
+.panel__description {
   margin: 0 0 3px;
   padding: 2px 0 3px 0;
 }
diff --git a/core/modules/system/templates/admin-block-content.html.twig b/core/modules/system/templates/admin-block-content.html.twig
index e70e565..f1c5f27 100644
--- a/core/modules/system/templates/admin-block-content.html.twig
+++ b/core/modules/system/templates/admin-block-content.html.twig
@@ -18,16 +18,16 @@
 #}
 {%
   set classes = [
-    'admin-list',
+    'list-group',
     compact ? 'compact',
   ]
 %}
 {% if content %}
   <dl{{ attributes.addClass(classes) }}>
     {% for item in content %}
-      <dt>{{ item.link }}</dt>
+      <dt class="list-group__link">{{ item.link }}</dt>
       {% if item.description %}
-        <dd>{{ item.description }}</dd>
+        <dd class="list-group__description">{{ item.description }}</dd>
       {% endif %}
     {% endfor %}
   </dl>
diff --git a/core/modules/system/templates/admin-block.html.twig b/core/modules/system/templates/admin-block.html.twig
index 20aa000..c3dab0e 100644
--- a/core/modules/system/templates/admin-block.html.twig
+++ b/core/modules/system/templates/admin-block.html.twig
@@ -14,13 +14,13 @@
  * @ingroup themeable
  */
 #}
-<div class="admin-panel">
+<div class="panel">
   {% if block.title %}
-    <h3>{{ block.title }}</h3>
+    <h3 class="panel__title">{{ block.title }}</h3>
   {% endif %}
   {% if block.content %}
-    <div class="body">{{ block.content }}</div>
+    <div class="panel__content">{{ block.content }}</div>
   {% elseif block.description %}
-    <div class="description">{{ block.description }}</div>
+    <div class="panel__description">{{ block.description }}</div>
   {% endif %}
 </div>
diff --git a/core/themes/bartik/bartik.libraries.yml b/core/themes/bartik/bartik.libraries.yml
index 30e83fc..7449276 100644
--- a/core/themes/bartik/bartik.libraries.yml
+++ b/core/themes/bartik/bartik.libraries.yml
@@ -7,6 +7,7 @@ global-styling:
       css/components/admin.css: {}
       css/components/block.css: {}
       css/components/book.css: {}
+      css/components/buttons.css: {}
       css/components/breadcrumb.css: {}
       css/components/captions.css: {}
       css/components/comments.css: {}
@@ -21,9 +22,11 @@ global-styling:
       css/components/header.css: {}
       css/components/region-help.css: {}
       css/components/item-list.css: {}
+      css/components/list-group.css: {}
       css/components/messages.css: {}
       css/components/node-preview.css: {}
       css/components/pager.css: {}
+      css/components/panel.css: {}
       css/components/primary-menu.css: {}
       css/components/search.css: {}
       css/components/search-results.css: {}
@@ -39,7 +42,6 @@ global-styling:
       # @see https://www.drupal.org/node/2389735
       css/components/vertical-tabs.component.css: {}
       css/components/views.css: {}
-      css/components/buttons.css: {}
       css/colors.css: {}
       css/print.css: { media: print }
 
diff --git a/core/themes/bartik/css/components/admin.css b/core/themes/bartik/css/components/admin.css
index bb1d6ed..82d7a9c 100644
--- a/core/themes/bartik/css/components/admin.css
+++ b/core/themes/bartik/css/components/admin.css
@@ -30,28 +30,7 @@
 #header .demo-block {
   width: 500px;
 }
-
-/* Configuration. */
-div.admin-panel {
-  background: #fbfbfb;
-  border: 1px solid #ccc;
-  margin: 10px 0;
-  padding: 0 5px 5px;
-}
-div.admin-panel h3 {
-  margin: 16px 7px;
-}
-div.admin-panel dt {
-  border-top: 1px solid #ccc;
-  padding: 7px 0 0;
-}
-div.admin-panel dd {
-  margin: 0 0 10px;
-}
-div.admin-panel .description {
-  margin: 0 0 14px 7px; /* LTR */
-}
-[dir="rtl"] div.admin-panel .description {
+[dir="rtl"] .admin-panel__description {
   margin-left: 0;
   margin-right: 7px;
 }
diff --git a/core/themes/bartik/css/components/list-group.css b/core/themes/bartik/css/components/list-group.css
new file mode 100644
index 0000000..6e4eb35
--- /dev/null
+++ b/core/themes/bartik/css/components/list-group.css
@@ -0,0 +1,12 @@
+/**
+ * @file
+ * Visual styles for Bartik's list groups.
+ */
+
+.list-group__link {
+  border-top: 1px solid #ccc;
+  padding: 7px 0 0;
+}
+.list-group__description {
+  margin: 0 0 10px;
+}
diff --git a/core/themes/bartik/css/components/panel.css b/core/themes/bartik/css/components/panel.css
new file mode 100644
index 0000000..796546e
--- /dev/null
+++ b/core/themes/bartik/css/components/panel.css
@@ -0,0 +1,14 @@
+/**
+ * @file
+ * Visual styles for Bartik's panel theming.
+ */
+
+.panel {
+  background: #fbfbfb;
+  border: 1px solid #ccc;
+  margin: 10px 0;
+  padding: 0 5px 5px;
+}
+.panel__title {
+  margin: 16px 7px;
+}
diff --git a/core/themes/seven/css/components/admin-panel.css b/core/themes/seven/css/components/admin-panel.css
deleted file mode 100644
index ad27d3b..0000000
--- a/core/themes/seven/css/components/admin-panel.css
+++ /dev/null
@@ -1,20 +0,0 @@
-/**
- * Admin panel.
- */
-div.admin-panel,
-div.admin-panel .body {
-  padding: 0;
-  clear: left;
-}
-div.admin-panel {
-  margin: 0 0 20px;
-  padding: 9px;
-  background: #f8f8f8;
-  border: 1px solid #ccc;
-}
-div.admin-panel h3 {
-  font-size: 0.923em;
-  text-transform: uppercase;
-  margin: 0;
-  padding-bottom: 9px;
-}
diff --git a/core/themes/seven/seven.libraries.yml b/core/themes/seven/seven.libraries.yml
index 445c302..e0abbb5 100644
--- a/core/themes/seven/seven.libraries.yml
+++ b/core/themes/seven/seven.libraries.yml
@@ -7,7 +7,6 @@ global-styling:
       css/base/print.css: {}
     component:
       css/components/admin-list.css: {}
-      css/components/admin-panel.css: {}
       css/components/block-recent-content.css: {}
       css/components/content-header.css: {}
       css/components/breadcrumb.css: {}
@@ -26,6 +25,7 @@ global-styling:
       css/components/node.css: {}
       css/components/page-title.css: {}
       css/components/pager.css: {}
+      css/components/panel.css: {}
       css/components/skip-link.css: {}
       css/components/tables.css: {}
       css/components/tabs.css: {}
