diff --git a/core/modules/user/css/user.module.css b/core/modules/user/css/user.module.css
index 892a8b4a564..4b20a6dd48a 100644
--- a/core/modules/user/css/user.module.css
+++ b/core/modules/user/css/user.module.css
@@ -25,13 +25,15 @@
   display: inline;
 }
 .password-strength__meter {
-  background-color: #c4c4c4;
+  background-color: #ebeae4;
   height: 0.5em;
 }
 .password-strength__indicator {
   height: 100%;
   width: 0%;
-  background-color: #47c965;
+  background-color: #77b259;
+  -webkit-transition: width 0.5s ease-out;
+  transition: width 0.5s ease-out;
 }
 input.password-confirm,
 input.password-field,
diff --git a/core/modules/user/user.js b/core/modules/user/user.js
index 82d165c26db..3b456d782a3 100644
--- a/core/modules/user/user.js
+++ b/core/modules/user/user.js
@@ -152,19 +152,19 @@
     // Based on the strength, work out what text should be shown by the password strength meter.
     if (strength < 60) {
       indicatorText = translate.weak;
-      indicatorColor = '#bb5555';
+      indicatorColor = '#e62600';
     }
     else if (strength < 70) {
       indicatorText = translate.fair;
-      indicatorColor = '#bbbb55';
+      indicatorColor = '#e09600';
     }
     else if (strength < 80) {
       indicatorText = translate.good;
-      indicatorColor = '#4863a0';
+      indicatorColor = '#0074bd';
     }
     else if (strength <= 100) {
       indicatorText = translate.strong;
-      indicatorColor = '#47c965';
+      indicatorColor = '#77b259';
     }
 
     // Assemble the final message.