diff --git a/app/assets/javascripts/vue_merge_request_widget/components/states/work_in_progress.vue b/app/assets/javascripts/vue_merge_request_widget/components/states/work_in_progress.vue
index 7078e19d8bf81ff1c0b23f53c093bbe516f5bae2..89c9a41f316504e8bed67ac8f0a28dc1847e67f1 100644
--- a/app/assets/javascripts/vue_merge_request_widget/components/states/work_in_progress.vue
+++ b/app/assets/javascripts/vue_merge_request_widget/components/states/work_in_progress.vue
@@ -62,7 +62,7 @@ export default {
         v-if="mr.removeWIPPath"
         :disabled="isMakingRequest"
         type="button"
-        class="btn btn-default btn-xs js-remove-wip"
+        class="btn btn-default btn-sm js-remove-wip"
         @click="removeWIP">
         <i
           v-if="isMakingRequest"
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 88b174491dd884094529eaa12290b32910d24565..523fcb05a874133597f90c885d5fa6b2680f4c54 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -121,10 +121,6 @@
   &.btn-sm {
     margin-left: $btn-sm-side-margin;
   }
-
-  &.btn-xs {
-    margin-left: $btn-xs-side-margin;
-  }
 }
 
 @mixin btn-svg {
@@ -150,10 +146,6 @@
     line-height: 18px;
   }
 
-  &.btn-xs {
-    padding: 2px 5px;
-  }
-
   &.btn-success,
   &.btn-new,
   &.btn-create,
diff --git a/app/assets/stylesheets/framework/markdown_area.scss b/app/assets/stylesheets/framework/markdown_area.scss
index b893151e4fe6ea9abd7e4a0c374e1f5a536e92fc..7290a174668f3e59c5c659634c0139e093f19012 100644
--- a/app/assets/stylesheets/framework/markdown_area.scss
+++ b/app/assets/stylesheets/framework/markdown_area.scss
@@ -61,10 +61,6 @@
       padding-top: 0;
       line-height: 19px;
 
-      &.btn.btn-xs {
-        padding: 2px 5px;
-      }
-
       &:focus {
         margin-top: -10px;
         padding-top: 10px;
diff --git a/app/assets/stylesheets/framework/secondary_navigation_elements.scss b/app/assets/stylesheets/framework/secondary_navigation_elements.scss
index 4e2cc4988837f3cfe2c0aa19fa3069184df2888c..2d9e9e6a67dd101c89df4dbbba095058a3e70227 100644
--- a/app/assets/stylesheets/framework/secondary_navigation_elements.scss
+++ b/app/assets/stylesheets/framework/secondary_navigation_elements.scss
@@ -197,7 +197,7 @@
     flex-flow: row wrap;
 
     .nav-controls {
-      $controls-margin: $btn-xs-side-margin - 2px;
+      $controls-margin: $btn-margin-5 - 2px;
       flex: 0 0 100%;
 
       &.controls-flex {
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index d1179df96a9ea345b5263f5b34062fe138410d84..0826bfd0035af879d910fa71bfcaa563f54350c9 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -278,7 +278,7 @@ $active-item-blue: $blue-500;
 $layout-link-gray: #7e7c7c;
 $btn-side-margin: 10px;
 $btn-sm-side-margin: 7px;
-$btn-xs-side-margin: 5px;
+$btn-margin-5: 5px;
 $issue-status-expired: $orange-500;
 $issuable-sidebar-color: $gl-text-color-secondary;
 $sidebar-block-hover-color: #ebebeb;
diff --git a/app/assets/stylesheets/pages/groups.scss b/app/assets/stylesheets/pages/groups.scss
index c2b42e02eee65eab1a3aa432f1b5ca607bb9c301..05bf5596fb325355b06c6973b0c2c91e85f98437 100644
--- a/app/assets/stylesheets/pages/groups.scss
+++ b/app/assets/stylesheets/pages/groups.scss
@@ -425,7 +425,7 @@
       margin-left: 5px;
 
       > .btn {
-        margin-right: $btn-xs-side-margin;
+        margin-right: $btn-margin-5;
       }
     }
   }
diff --git a/app/assets/stylesheets/pages/merge_requests.scss b/app/assets/stylesheets/pages/merge_requests.scss
index f50ca677800c4280f0426392283a4ac8d4f090ce..99fe4a578be86554d34b40353b23987e156f29de 100644
--- a/app/assets/stylesheets/pages/merge_requests.scss
+++ b/app/assets/stylesheets/pages/merge_requests.scss
@@ -51,12 +51,6 @@
       opacity: 0.3;
     }
 
-    &.btn-xs {
-      line-height: 1;
-      padding: 5px 10px;
-      margin-top: 1px;
-    }
-
     &.dropdown-toggle {
       .fa {
         color: inherit;
diff --git a/app/assets/stylesheets/pages/note_form.scss b/app/assets/stylesheets/pages/note_form.scss
index 3b037d066dcac56b86525f11ec316546cb76279d..3849a04db5dd92c9901f744c7a59d418f5db95d3 100644
--- a/app/assets/stylesheets/pages/note_form.scss
+++ b/app/assets/stylesheets/pages/note_form.scss
@@ -129,7 +129,7 @@
     .icon svg {
       position: relative;
       top: 2px;
-      margin-right: $btn-xs-side-margin;
+      margin-right: $btn-margin-5;
       width: $gl-font-size;
       height: $gl-font-size;
       fill: $orange-600;