diff --git a/core/includes/batch.inc b/core/includes/batch.inc
index 2152725..3fd5c1d 100644
--- a/core/includes/batch.inc
+++ b/core/includes/batch.inc
@@ -84,9 +84,9 @@ function _batch_page() {
  */
 function _batch_do() {
   // Perform actual processing.
-  list($percentage, $message) = _batch_process();
+  list($percentage, $message, $label) = _batch_process();
 
-  return new JsonResponse(array('status' => TRUE, 'percentage' => $percentage, 'message' => $message));
+  return new JsonResponse(array('status' => TRUE, 'percentage' => $percentage, 'message' => $message, 'label' => $label));
 }
 
 /**
@@ -106,6 +106,7 @@ function _batch_progress_page() {
     // This is the first page so we return some output immediately.
     $percentage       = 0;
     $message          = $current_set['init_message'];
+    $label            = '';
     $batch['running'] = TRUE;
   }
   else {
@@ -126,7 +127,7 @@ function _batch_progress_page() {
     print $fallback;
 
     // Perform actual processing.
-    list($percentage, $message) = _batch_process($batch);
+    list($percentage, $message, $label) = _batch_process($batch);
     if ($percentage == 100) {
       $new_op = 'finished';
     }
@@ -164,7 +165,7 @@ function _batch_progress_page() {
   drupal_add_js($js_setting, 'setting');
   drupal_add_library('system', 'drupal.batch');
 
-  return theme('progress_bar', array('percent' => $percentage, 'message' => $message));
+  return theme('progress_bar', array('percent' => $percentage, 'message' => $message, 'label' => $label));
 }
 
 /**
@@ -206,7 +207,7 @@ function _batch_process() {
       include_once DRUPAL_ROOT . '/' . $current_set['file'];
     }
 
-    $task_message = '';
+    $task_message = $label = '';
     // Assume a single pass operation and set the completion level to 1 by
     // default.
     $finished = 1;
@@ -294,14 +295,11 @@ function _batch_process() {
       '@estimate'   => ($current > 0) ? format_interval(($elapsed * ($total - $current) / $current) / 1000) : '-',
     );
     $message = strtr($progress_message, $values);
-    if (!empty($message)) {
-      $message .= '<br />';
-    }
     if (!empty($task_message)) {
-      $message .= $task_message;
+      $label = $task_message;
     }
 
-    return array($percentage, $message);
+    return array($percentage, $message, $label);
   }
   else {
     // If we are not in progressive mode, the entire batch has been processed.
diff --git a/core/includes/theme.inc b/core/includes/theme.inc
index 009d07e..95f1b54 100644
--- a/core/includes/theme.inc
+++ b/core/includes/theme.inc
@@ -2474,9 +2474,10 @@ function theme_more_link($variables) {
  */
 function theme_progress_bar($variables) {
   $output = '<div id="progress" class="progress">';
-  $output .= '<div class="bar"><div class="filled" style="width: ' . $variables['percent'] . '%"></div></div>';
-  $output .= '<div class="percentage">' . $variables['percent'] . '%</div>';
-  $output .= '<div class="message">' . $variables['message'] . '</div>';
+  $output .= '<div class="progress__label">' . $variables['label'] . '</div>';
+  $output .= '<div class="progress__track"><div class="progress__bar" style="width: ' . $variables['percent'] . '%"></div></div>';
+  $output .= '<div class="progress__percentage">' . $variables['percent'] . '%</div>';
+  $output .= '<div class="progress__description">' . $variables['message'] . '</div>';
   $output .= '</div>';
 
   return $output;
diff --git a/core/misc/progress.js b/core/misc/progress.js
index 2e3a878..f3c85f1 100644
--- a/core/misc/progress.js
+++ b/core/misc/progress.js
@@ -21,21 +21,23 @@ Drupal.ProgressBar = function (id, updateCallback, method, errorCallback) {
   // The WAI-ARIA setting aria-live="polite" will announce changes after users
   // have completed their current activity and not interrupt the screen reader.
   this.element = $('<div class="progress" aria-live="polite"></div>').attr('id', id);
-  this.element.html('<div class="bar"><div class="filled"></div></div>' +
-                    '<div class="percentage"></div>' +
-                    '<div class="message">&nbsp;</div>');
+  this.element.html('<div class="progress__label">&nbsp;</div>' +
+                    '<div class="progress__track"><div class="progress__bar"></div></div>' +
+                    '<div class="progress__percentage"></div>' +
+                    '<div class="progress__description">&nbsp;</div>');
 };
 
 $.extend(Drupal.ProgressBar.prototype, {
   /**
    * Set the percentage and status message for the progressbar.
    */
-  setProgress: function (percentage, message) {
+  setProgress: function (percentage, message, label) {
     if (percentage >= 0 && percentage <= 100) {
-      $(this.element).find('div.filled').css('width', percentage + '%');
-      $(this.element).find('div.percentage').html(percentage + '%');
+      $(this.element).find('div.progress__bar').css('width', percentage + '%');
+      $(this.element).find('div.progress__percentage').html(percentage + '%');
     }
-    $('div.message', this.element).html(message);
+    $('div.progress__description', this.element).html(message);
+    $('div.progress__label', this.element).html(label);
     if (this.updateCallback) {
       this.updateCallback(percentage, message, this);
     }
@@ -81,8 +83,9 @@ $.extend(Drupal.ProgressBar.prototype, {
             pb.displayError(progress.data);
             return;
           }
+          console.log(progress);
           // Update display.
-          pb.setProgress(progress.percentage, progress.message);
+          pb.setProgress(progress.percentage, progress.message, progress.label);
           // Schedule next timer.
           pb.timer = setTimeout(function () { pb.sendPing(); }, pb.delay);
         },
diff --git a/core/modules/system/system.base-rtl.css b/core/modules/system/system.base-rtl.css
index d01792e..e5fd503 100644
--- a/core/modules/system/system.base-rtl.css
+++ b/core/modules/system/system.base-rtl.css
@@ -18,10 +18,10 @@
 /**
  * Progress bar.
  */
-.progress .percentage {
+.progress__percentage {
   float: left;
 }
-.progress-disabled {
+.progress__description {
   float: right;
 }
 .ajax-progress {
diff --git a/core/modules/system/system.base.css b/core/modules/system/system.base.css
index 08ff66c..032ce8d 100644
--- a/core/modules/system/system.base.css
+++ b/core/modules/system/system.base.css
@@ -159,19 +159,44 @@ table.sticky-header {
  *
  * @see progress.js
  */
-/* Bar */
-.progress .bar {
+.progress {
+  position: relative;
+}
+.progress__track {
   background-color: #fff;
   border: 1px solid;
+  margin-top: 5px;
+  max-width: 100%;
+  min-width: 100px;
+  height: 16px;
+  background-color: #fff;
 }
-.progress .filled {
+.progress__bar {
   background-color: #000;
   height: 1.5em;
-  width: 5px;
+  width: 3%;
+}
+.progress__description,
+.progress__percentage {
+  color: #555;
+  overflow: hidden;
+  font-size: .875em;
+  margin-top: 0.2em;
 }
-.progress .percentage {
+.progress__description {
+  float: left;  /* LTR */
+}
+.progress__percentage {
   float: right; /* LTR */
 }
+.progress--small .progress__track {
+  height: 7px;
+}
+.progress--small .progress__bar {
+  height: 7px;
+  background-size: 20px 20px;
+}
+
 /* Throbber */
 .ajax-progress {
   display: inline-block;
diff --git a/core/modules/system/system.theme.css b/core/modules/system/system.theme.css
index a3c770a..6d6baf4 100644
--- a/core/modules/system/system.theme.css
+++ b/core/modules/system/system.theme.css
@@ -293,17 +293,91 @@ th.checkbox {
  *
  * @see progress.js
  */
-.progress {
-  font-weight: bold;
+.progress__track {
+  border-color: #b3b3b3;
+  border-radius: 10em;
+  background-color: #f2f1eb;
+  background-image: -webkit-linear-gradient(#e7e7df, #f0f0f0);
+  background-image:    -moz-linear-gradient(#e7e7df, #f0f0f0);
+  background-image:      -o-linear-gradient(#e7e7df, #f0f0f0);
+  background-image:         linear-gradient(#e7e7df, #f0f0f0);
+  box-shadow: inset 0 1px 3px hsla(0, 0%, 0%, 0.16);
+}
+.progress__bar {
+  border: 1px #07629a solid;
+  background: #057ec9;
+  background-image:
+    -webkit-linear-gradient( top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) ),
+    -webkit-linear-gradient( left top,
+      #0094f0 0%,
+      #0094f0 25%,
+      #007ecc 25%,
+      #007ecc 50%,
+      #0094f0 50%,
+      #0094f0 75%,
+      #0094f0 100% );
+  background-image:
+    -moz-linear-gradient( top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) ),
+    -moz-linear-gradient( left top,
+      #0094f0 0%,
+      #0094f0 25%,
+      #007ecc 25%,
+      #007ecc 50%,
+      #0094f0 50%,
+      #0094f0 75%,
+      #0094f0 100% );
+  background-image:
+    -o-linear-gradient( top, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) ),
+    -o-linear-gradient( left top,
+      #0094f0 0%,
+      #0094f0 25%,
+      #007ecc 25%,
+      #007ecc 50%,
+      #0094f0 50%,
+      #0094f0 75%,
+      #0094f0 100% );
+  background-image:
+    linear-gradient( to bottom, rgba(0, 0, 0, 0), rgba(0, 0, 0, 0.15) ),
+    linear-gradient( to right bottom,
+      #0094f0 0%,
+      #0094f0 25%,
+      #007ecc 25%,
+      #007ecc 50%,
+      #0094f0 50%,
+      #0094f0 75%,
+      #0094f0 100% );
+  background-size: 40px 40px;
+  margin-top: -1px;
+  margin-left: -1px;
+  padding: 0 1px;
+  height: 16px;
+  border-radius: 10em;
+  -webkit-animation: animate-stripes 3s linear infinite;
+  -moz-animation: animate-stripes 3s linear infinite;
+  -webkit-transition: width 0.5s ease-out;
+  -moz-transition: width 0.5s ease-out;
+  -ms-transition: width 0.5s ease-out;
+  -o-transition: width 0.5s ease-out;
+  transition: width 0.5s ease-out;
+}
+
+/**
+ * Progress bar animations.
+ */
+@-webkit-keyframes animate-stripes {
+  0% {background-position: 0 0, 0 0;} 100% {background-position: 0 0, -80px 0;}
+}
+@-moz-keyframes animate-stripes {
+  0% {background-position: 0 0, 0 0;} 100% {background-position: 0 0, -80px 0;}
+}
+@-o-keyframes animate-stripes {
+  0% {background-position: 0 0, 0 0;} 100% {background-position: 0 0, -80px 0;}
 }
-.progress .bar {
-  background: #ccc;
-  border-color: #666;
-  margin: 0 0.2em;
-  border-radius: 3px;
+@-ms-keyframes animate-stripes {
+  0% {background-position: 0 0, 0 0;} 100% {background-position: 0 0, -80px 0;}
 }
-.progress .filled {
-  background: #0072b9 url(../../misc/progress.gif);
+@keyframes animate-stripes {
+  0% {background-position: 0 0, 0 0;} 100% {background-position: 0 0, -80px 0;}
 }
 
 /**
