diff --git a/docs/assets/css/bootstrap.css b/docs/assets/css/bootstrap.css
index 43d391acf8..f5dd155fc9 100644
--- a/docs/assets/css/bootstrap.css
+++ b/docs/assets/css/bootstrap.css
@@ -4926,13 +4926,13 @@ a.badge:hover {
   cursor: pointer;
 }
 
-.label-important,
-.badge-important {
+.label-danger,
+.badge-danger {
   background-color: #b94a48;
 }
 
-.label-important[href],
-.badge-important[href] {
+.label-danger[href],
+.badge-danger[href] {
   background-color: #953b39;
 }
 
diff --git a/docs/components.html b/docs/components.html
index 14e9041f3b..927efd26ab 100644
--- a/docs/components.html
+++ b/docs/components.html
@@ -1552,10 +1552,10 @@
               </tr>
               <tr>
                 <td>
-                  <span class="label label-important">Important</span>
+                  <span class="label label-danger">Danger</span>
                 </td>
                 <td>
-                  <code>&lt;span class="label label-important"&gt;Important&lt;/span&gt;</code>
+                  <code>&lt;span class="label label-danger"&gt;Danger&lt;/span&gt;</code>
                 </td>
               </tr>
               <tr>
@@ -1625,10 +1625,10 @@
                   Important
                 </td>
                 <td>
-                  <span class="badge badge-important">6</span>
+                  <span class="badge badge-danger">6</span>
                 </td>
                 <td>
-                  <code>&lt;span class="badge badge-important"&gt;6&lt;/span&gt;</code>
+                  <code>&lt;span class="badge badge-danger"&gt;6&lt;/span&gt;</code>
                 </td>
               </tr>
               <tr>
diff --git a/docs/templates/pages/components.mustache b/docs/templates/pages/components.mustache
index 9e796b9ba2..54fce9c4a2 100644
--- a/docs/templates/pages/components.mustache
+++ b/docs/templates/pages/components.mustache
@@ -1484,10 +1484,10 @@
               </tr>
               <tr>
                 <td>
-                  <span class="label label-important">{{_i}}Important{{/i}}</span>
+                  <span class="label label-danger">{{_i}}Danger{{/i}}</span>
                 </td>
                 <td>
-                  <code>&lt;span class="label label-important"&gt;{{_i}}Important{{/i}}&lt;/span&gt;</code>
+                  <code>&lt;span class="label label-danger"&gt;{{_i}}Danger{{/i}}&lt;/span&gt;</code>
                 </td>
               </tr>
               <tr>
@@ -1557,10 +1557,10 @@
                   {{_i}}Important{{/i}}
                 </td>
                 <td>
-                  <span class="badge badge-important">6</span>
+                  <span class="badge badge-danger">6</span>
                 </td>
                 <td>
-                  <code>&lt;span class="badge badge-important"&gt;6&lt;/span&gt;</code>
+                  <code>&lt;span class="badge badge-danger"&gt;6&lt;/span&gt;</code>
                 </td>
               </tr>
               <tr>
diff --git a/less/labels-badges.less b/less/labels-badges.less
index 3ca0d6e200..5c8b1c25f3 100644
--- a/less/labels-badges.less
+++ b/less/labels-badges.less
@@ -50,8 +50,8 @@ a {
 .label,
 .badge {
   // Important (red)
-  &-important         { background-color: @errorText; }
-  &-important[href]   { background-color: darken(@errorText, 10%); }
+  &-danger            { background-color: @errorText; }
+  &-danger[href]      { background-color: darken(@errorText, 10%); }
   // Warnings (orange)
   &-warning           { background-color: @orange; }
   &-warning[href]     { background-color: darken(@orange, 10%); }