diff --git a/core/modules/user/css/user.module.css b/core/modules/user/css/user.module.css
index 869d016..5b5c764 100644
--- a/core/modules/user/css/user.module.css
+++ b/core/modules/user/css/user.module.css
@@ -1,60 +1,20 @@
 /**
- * Password strength indicator.
+ * @file
+ * Password strength indicator component.
  */
 .password-strength__title,
 .password-strength__text {
   display: inline;
 }
 .password-strength__meter {
-  background-color: #ebeae4;
   height: 0.75em;
-  margin-top: 0.5em;
+  background-color: lightgray;
 }
 .password-strength__indicator {
+  background-color: gray;
   height: 100%;
-  width: 0%;
-  background-color: #77b259;
-  -webkit-transition: width 0.5s ease-out;
-  transition: width 0.5s ease-out;
-}
-input.password-confirm,
-input.password-field,
-.password-strength {
-  width: 55%;
+  width: 0;
 }
 div.password-confirm {
   visibility: hidden;
-  width: 55%;
-}
-div.form-item div.password-suggestions {
-  padding: 0.2em 0.5em;
-  margin: 0.7em 0;
-  max-width: 34.7em;
-  border: 1px solid #b4b4b4;
-}
-div.password-suggestions ul {
-  margin-bottom: 0;
-}
-.confirm-parent,
-.password-parent {
-  clear: left; /* LTR */
-  margin: 0;
-  max-width: 33em;
-  overflow: hidden;
-}
-[dir="rtl"] .confirm-parent,
-[dir="rtl"] .password-parent {
-  clear: right;
-}
-.password-strength__indicator.is-weak {
-  background-color: #e62600;
-}
-.password-strength__indicator.is-fair {
-  background-color: #e09600;
-}
-.password-strength__indicator.is-good {
-  background-color: #0074bd;
-}
-.password-strength__indicator.is-strong {
-  background-color: #77b259;
 }
diff --git a/core/modules/user/css/user.module.css b/core/modules/user/css/user.theme.css
similarity index 79%
copy from core/modules/user/css/user.module.css
copy to core/modules/user/css/user.theme.css
index 869d016..635e72b 100644
--- a/core/modules/user/css/user.module.css
+++ b/core/modules/user/css/user.theme.css
@@ -1,38 +1,46 @@
 /**
- * Password strength indicator.
+ * @file
+ * Visual styling for the Password strength indicator.
  */
-.password-strength__title,
-.password-strength__text {
-  display: inline;
-}
 .password-strength__meter {
-  background-color: #ebeae4;
-  height: 0.75em;
   margin-top: 0.5em;
+  background-color: #ebeae4;
 }
 .password-strength__indicator {
-  height: 100%;
-  width: 0%;
   background-color: #77b259;
   -webkit-transition: width 0.5s ease-out;
   transition: width 0.5s ease-out;
 }
+.form-item .password-suggestions {
+  border: 1px solid #b4b4b4;
+}
+.password-strength__indicator.is-weak {
+  background-color: #e62600;
+}
+.password-strength__indicator.is-fair {
+  background-color: #e09600;
+}
+.password-strength__indicator.is-good {
+  background-color: #0074bd;
+}
+.password-strength__indicator.is-strong {
+  background-color: #77b259;
+}
 input.password-confirm,
 input.password-field,
 .password-strength {
   width: 55%;
 }
 div.password-confirm {
-  visibility: hidden;
   width: 55%;
 }
-div.form-item div.password-suggestions {
+
+.form-item .password-suggestions {
   padding: 0.2em 0.5em;
   margin: 0.7em 0;
   max-width: 34.7em;
-  border: 1px solid #b4b4b4;
 }
-div.password-suggestions ul {
+.password-suggestions ul {
   margin-bottom: 0;
 }
 .confirm-parent,
@@ -46,15 +54,3 @@ div.password-suggestions ul {
 [dir="rtl"] .password-parent {
   clear: right;
 }
-.password-strength__indicator.is-weak {
-  background-color: #e62600;
-}
-.password-strength__indicator.is-fair {
-  background-color: #e09600;
-}
-.password-strength__indicator.is-good {
-  background-color: #0074bd;
-}
-.password-strength__indicator.is-strong {
-  background-color: #77b259;
-}
diff --git a/core/modules/user/user.libraries.yml b/core/modules/user/user.libraries.yml
index 037023a..8376351 100644
--- a/core/modules/user/user.libraries.yml
+++ b/core/modules/user/user.libraries.yml
@@ -5,6 +5,8 @@ drupal.user:
   css:
     component:
       css/user.module.css: {}
+    theme:
+      css/user.theme.css: {}
   dependencies:
     - core/jquery
     - core/drupal