diff --git a/app/assets/javascripts/content_editor/components/toolbar_table_button.vue b/app/assets/javascripts/content_editor/components/toolbar_table_button.vue
index 4f1d61eff10e5cd307643dd60a98d48650b8baea..37c5ffd732d1a27c593d3e6294d100d3bb033217 100644
--- a/app/assets/javascripts/content_editor/components/toolbar_table_button.vue
+++ b/app/assets/javascripts/content_editor/components/toolbar_table_button.vue
@@ -115,7 +115,7 @@ export default {
               :ref="`table-${r}-${c}`"
               :class="{ 'active !gl-bg-blue-50': r <= rows && c <= cols }"
               :aria-label="getButtonLabel(r, c)"
-              class="table-creator-grid-item gl-inline !gl-h-6 !gl-w-6 !gl-rounded-none !gl-p-0"
+              class="table-creator-grid-item gl-m-2 !gl-rounded-none !gl-p-0"
               @mouseover="setRowsAndCols(r, c)"
               @focus="setRowsAndCols(r, c)"
               @click="insertTable()"
diff --git a/app/assets/stylesheets/components/content_editor.scss b/app/assets/stylesheets/components/content_editor.scss
index e5fdc00ab24a8c6b46e3ef5cf66fbbfd42337109..4578b2d31d0a158d321e630f1a21a4311a17d531 100644
--- a/app/assets/stylesheets/components/content_editor.scss
+++ b/app/assets/stylesheets/components/content_editor.scss
@@ -316,14 +316,12 @@
 }
 
 .table-creator-grid-item {
-  box-shadow: inset 0 0 0 $gl-spacing-scale-2 $white,
-    inset $gl-spacing-scale-1 $gl-spacing-scale-1 0 #{$gl-spacing-scale-2 * 3 / 4} $gray-100,
-    inset #{-$gl-spacing-scale-1} #{-$gl-spacing-scale-1} 0 #{$gl-spacing-scale-2 * 3 / 4} $gray-100 !important;
+  min-height: 1rem !important;
+  min-width: 1rem !important;
 
   &.active {
-    box-shadow: inset 0 0 0 $gl-spacing-scale-2 $white,
-      inset $gl-spacing-scale-1 $gl-spacing-scale-1 0 $gl-spacing-scale-2 $blue-500,
-      inset #{-$gl-spacing-scale-1} #{-$gl-spacing-scale-1} 0 $gl-spacing-scale-2 $blue-500 !important;
+    border-color: $blue-500 !important;
+    border-width: 2px;
   }
 }
 
diff --git a/app/assets/stylesheets/framework/awards.scss b/app/assets/stylesheets/framework/awards.scss
index db882f78b29832e29c300dfdae3d32741076422b..7a596121a71e7077caf3de190306b0e181d6bb03 100644
--- a/app/assets/stylesheets/framework/awards.scss
+++ b/app/assets/stylesheets/framework/awards.scss
@@ -10,7 +10,7 @@
   // Show active state.
   .gl-button.selected {
     background-color: var(--blue-50) !important;
-    box-shadow: inset 0 0 0 2px var(--blue-500) !important;
+    border-color: var(--blue-500) !important;
   }
 }
 
@@ -139,7 +139,6 @@
     &:active {
       background-color: $white;
       border-color: $border-color;
-      box-shadow: none;
     }
   }
 
@@ -162,7 +161,6 @@
   &:active {
     background-color: $blue-50;
     border-color: $blue-200;
-    box-shadow: inset 0 0 2px $blue-200;
   }
 
   &.is-active {
@@ -331,15 +329,6 @@
   }
 }
 
-.award-list .gl-button:focus {
-  @include gl-focus(
-    $outline: true,
-    $outline-offset: -2px,
-    $important: true
-  );
-  box-shadow: none !important;
-}
-
 .design-note.note-form .emoji-picker .gl-new-dropdown-panel {
   left: 0 !important;
 }
diff --git a/app/assets/stylesheets/framework/buttons.scss b/app/assets/stylesheets/framework/buttons.scss
index 13122848b1baaea74675bf63842af3e6ca26675a..80eade3171f859587055529dfe3a7991a86d35b1 100644
--- a/app/assets/stylesheets/framework/buttons.scss
+++ b/app/assets/stylesheets/framework/buttons.scss
@@ -7,7 +7,6 @@
   &:focus,
   &:active {
     background-color: $btn-active-gray;
-    box-shadow: none;
   }
 }
 
@@ -134,7 +133,6 @@
   &:active,
   &:focus {
     background-color: transparent;
-    box-shadow: none;
   }
 }
 
diff --git a/app/assets/stylesheets/framework/dropdowns.scss b/app/assets/stylesheets/framework/dropdowns.scss
index 8feb4793cbf07b9d5b88e38d54424b141dd42f1d..91e04dc700414d675c1431ce1391718c918356b2 100644
--- a/app/assets/stylesheets/framework/dropdowns.scss
+++ b/app/assets/stylesheets/framework/dropdowns.scss
@@ -137,10 +137,6 @@
   line-height: $gl-line-height;
   width: 160px;
 
-  &:hover {
-    @apply gl-shadow-inner-1-gray-400;
-  }
-
   &:hover,
   &:focus {
     background-color: $gray-50;
diff --git a/app/assets/stylesheets/framework/filters.scss b/app/assets/stylesheets/framework/filters.scss
index e35ade530aa2d28e1d76da1e8dcb612a22aabf9d..8cab9318000c6922c898b92d2053b8d7732c6527 100644
--- a/app/assets/stylesheets/framework/filters.scss
+++ b/app/assets/stylesheets/framework/filters.scss
@@ -273,7 +273,6 @@
 .filtered-search-history-dropdown-toggle-button.gl-button {
   border-radius: $gl-border-radius-base-inner 0 0 $gl-border-radius-base-inner;
   margin: -1px 0 -1px -1px;
-  box-shadow: inset 0 0 0 1px var(--gl-control-border-color-default);
   flex: 1;
   transition: color 0.1s linear;
   width: auto;
@@ -368,15 +367,6 @@
     min-width: 0;
   }
 
-  .sort-dropdown-container {
-    // This property is set to have borders
-    // around sort dropdown match with filter
-    // input field.
-    .gl-button {
-      box-shadow: inset 0 0 0 1px var(--gl-control-border-color-default);
-    }
-  }
-
   @include media-breakpoint-up(md) {
     .sort-dropdown-container {
       margin-left: 10px;
diff --git a/app/assets/stylesheets/framework/lists.scss b/app/assets/stylesheets/framework/lists.scss
index f89c252d3f01ab3e885aea9ed7684c200be65858..480b6600d6d42c9aab40abd41b8360c53cbb671e 100644
--- a/app/assets/stylesheets/framework/lists.scss
+++ b/app/assets/stylesheets/framework/lists.scss
@@ -112,7 +112,6 @@ ul.content-list {
       > .btn-group,
       > .dropdown.inline {
         margin-right: $grid-size;
-        display: inline-block;
 
         &.has-tooltip,
         &:last-child {
diff --git a/app/assets/stylesheets/framework/super_sidebar.scss b/app/assets/stylesheets/framework/super_sidebar.scss
index ab02c1c5f4a21206205b85a978a58e9e147e279d..ba097435377df76ff241066f8b709907b9853a70 100644
--- a/app/assets/stylesheets/framework/super_sidebar.scss
+++ b/app/assets/stylesheets/framework/super_sidebar.scss
@@ -351,7 +351,7 @@ $command-palette-spacing: px-to-rem(14px);
 
     .user-bar-button {
       background-color: var(--super-sidebar-user-bar-button-bg);
-      box-shadow: inset 0 0 0 $gl-border-size-1 var(--super-sidebar-user-bar-button-border-color);
+      border-color: var(--super-sidebar-user-bar-button-border-color);
 
       &[aria-expanded='true'] {
         background-color: var(--super-sidebar-user-bar-button-hover-bg);
diff --git a/app/assets/stylesheets/framework/variables.scss b/app/assets/stylesheets/framework/variables.scss
index 0133cf1e596bb2a6fb2951503e358663c87f8401..00bac3c20b261f67a5741efffe79f0146c05e4dc 100644
--- a/app/assets/stylesheets/framework/variables.scss
+++ b/app/assets/stylesheets/framework/variables.scss
@@ -452,3 +452,9 @@ $source-editor-hover-dark-text-color: $gl-color-neutral-900;
  - Issue: https://gitlab.com/gitlab-org/design.gitlab.com/issues/242
  */
 $enable-validation-icons: false;
+
+/*
+Enable GitLab UI CSS Feature Flag
+for GlButton migration from box-shadow to border.
+*/
+$feature-button-border: true;
diff --git a/app/assets/stylesheets/page_bundles/_ide_theme_overrides.scss b/app/assets/stylesheets/page_bundles/_ide_theme_overrides.scss
index 7aa5a3183ee67a392561ac8f23cfcabd51be0b48..7c6d71e9ea6b9f380dc62017e8b022719df05474 100644
--- a/app/assets/stylesheets/page_bundles/_ide_theme_overrides.scss
+++ b/app/assets/stylesheets/page_bundles/_ide_theme_overrides.scss
@@ -334,55 +334,6 @@
     color: var(--ide-btn-disabled-color, var(--gl-text-color-disabled)) !important;
   }
 
-  @function ide-btn-var($btn-type, $var-type, $value) {
-    @return var(--ide-btn-#{$btn-type}-#{$var-type}, $value);
-  }
-
-  @mixin ide-gl-button($btn-type, $bg-normal, $bg-hover, $bg-active, $border-normal, $border-hover, $border-focus, $border-active, $border-width-hover: 2px, $box-shadow-hover: $t-gray-a-08, $box-shadow-focus: 0 0 0 4px rgba($blue-500, 0.25)) {
-    background-color: ide-btn-var($btn-type, background, $bg-normal);
-    box-shadow: inset 0 0 0 1px ide-btn-var($btn-type, border, $border-normal);
-
-    &:hover,
-    &:focus {
-      background-color: ide-btn-var($btn-type, background, $bg-hover);
-    }
-
-    &:hover {
-      box-shadow: inset 0 0 0 ide-btn-var($btn-type, hover-border-width, $border-width-hover) ide-btn-var($btn-type, hover-border, $border-hover),
-        0 2px 2px 0 $box-shadow-hover;
-    }
-
-    &:focus {
-      box-shadow: inset 0 0 0 ide-btn-var($btn-type, hover-border-width, $border-width-hover) ide-btn-var($btn-type, hover-border, $border-focus),
-        ide-btn-var($btn-type, focus-box-shadow, $box-shadow-focus);
-    }
-
-    &:active:focus {
-      background-color: ide-btn-var($btn-type, background, $bg-active);
-      box-shadow: inset 0 0 0 ide-btn-var($btn-type, hover-border-width, $border-width-hover) ide-btn-var($btn-type, hover-border, $border-active),
-        ide-btn-var($btn-type, focus-box-shadow, $box-shadow-focus);
-    }
-  }
-
-  //gl-button is listed twice to overcome CSS specificity for the Bootstrap styles
-  .btn-default.gl-button.gl-button {
-    color: var(--ide-input-color, $gl-text-color);
-
-    @include ide-gl-button(default, $white, $gray-50, $gray-100, $gray-200, $gray-300, $gray-300, $gray-400);
-  }
-
-  .btn-danger.btn-danger-secondary.gl-button.gl-button {
-    color: var(--ide-input-color, $red-500);
-
-    @include ide-gl-button(danger-secondary, $white, $red-50, $red-100, $red-500, $red-600, $red-600, $red-700);
-  }
-
-  .btn[disabled].gl-button.gl-button {
-    color: var(--ide-btn-disabled-color, var(--gl-text-color-disabled));
-
-    @include ide-gl-button(disabled, $gray-10, $gray-10, $gray-10, $gray-100, $gray-100, $gray-100, $gray-100, 1px, transparent, transparent);
-  }
-
   .md table:not(.code) tbody {
     background-color: var(--ide-empty-state-background, $white);
   }
diff --git a/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss b/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss
index 5cf8116b6f07f682c645221d29844b3d37e6e8d7..0cdc5ce210b0598ea1ba18aadcbda40ae33532c2 100644
--- a/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss
+++ b/app/assets/stylesheets/page_bundles/_pipeline_mixins.scss
@@ -32,7 +32,6 @@
       display: block;
 
       &:hover {
-        box-shadow: inset 0 0 0 2px var(--gray-400, $gray-400);
         background-color: var(--gray-50, $gray-50);
       }
 
diff --git a/app/assets/stylesheets/page_bundles/oncall_schedules.scss b/app/assets/stylesheets/page_bundles/oncall_schedules.scss
index 0042e592a38eb7d280ba9e17b17c191162f6c792..ca69e11fc9fb0104c5f95ebe1213d2efe80b8d6b 100644
--- a/app/assets/stylesheets/page_bundles/oncall_schedules.scss
+++ b/app/assets/stylesheets/page_bundles/oncall_schedules.scss
@@ -1,16 +1,16 @@
 @import 'mixins_and_variables_and_functions';
 
-@mixin inset-border-1-red-500($important: false) {
-  box-shadow: inset 0 0 0 $gl-border-size-1 $red-500 if-important($important);
+.modal-footer {
+  background-color: $gray-10;
 }
 
 .invalid-dropdown {
   // stylelint-disable-next-line gitlab/no-gl-class
   .gl-button.gl-dropdown-toggle {
-    @include inset-border-1-red-500;
+    border-color: var(--red-500, $red-500);
 
     &:hover {
-      @include inset-border-1-red-500(true);
+      border-color: var(--red-500, $red-500);
     }
   }
 }
diff --git a/app/assets/stylesheets/page_bundles/pipeline.scss b/app/assets/stylesheets/page_bundles/pipeline.scss
index d7966959122f8f0e0bf37f9049203633d4aab23e..5480cdd4fa471320a273f478ee3a4f6b2ddf65c0 100644
--- a/app/assets/stylesheets/page_bundles/pipeline.scss
+++ b/app/assets/stylesheets/page_bundles/pipeline.scss
@@ -201,14 +201,6 @@
   }
 }
 
-.big-pipeline-graph-dropdown-menu {
-  @include pipeline-graph-dropdown-menu();
-  min-width: 195px;
-  left: 100%;
-  top: -10px;
-  box-shadow: 0 1px 5px $t-gray-a-24;
-}
-
 .codequality-report {
   .media {
     padding: $gl-padding;
diff --git a/app/assets/stylesheets/pages/commits.scss b/app/assets/stylesheets/pages/commits.scss
index 6f342d17dbceb0f3f1e109d815be417b213c78a6..1d10414284eb41b24767ef80325cc0a4cbd4d62e 100644
--- a/app/assets/stylesheets/pages/commits.scss
+++ b/app/assets/stylesheets/pages/commits.scss
@@ -124,10 +124,6 @@
     border-top-left-radius: $gl-border-radius-base;
   }
 
-  :not(:first-child) {
-    border-left: 0;
-  }
-
   :last-child {
     border-bottom-right-radius: $gl-border-radius-base;
     border-top-right-radius: $gl-border-radius-base;
diff --git a/app/views/projects/merge_requests/_mr_title.html.haml b/app/views/projects/merge_requests/_mr_title.html.haml
index 2ac21f4aab0d9fba9d2e810979cc5bfe481115e8..a090f354d26384a990ac6a4d81dce8cacebed3ee 100644
--- a/app/views/projects/merge_requests/_mr_title.html.haml
+++ b/app/views/projects/merge_requests/_mr_title.html.haml
@@ -26,7 +26,7 @@
         - edit_action_description = _('Edit merge request')
         - edit_action_shortcut = 'e'
         - edit_button_title = "#{edit_action_description} <kbd class='flat ml-1' aria-hidden=true>#{edit_action_shortcut}</kbd>"
-        = render Pajamas::ButtonComponent.new(href: edit_project_merge_request_path(@project, @merge_request), button_options: { aria: {label: edit_action_description, keyshortcuts: edit_action_shortcut}, class: "gl-hidden sm:gl-block gl-self-start has-tooltip js-issuable-edit", data: { html: "true", testid: "edit-title-button" }, title: edit_button_title }) do
+        = render Pajamas::ButtonComponent.new(href: edit_project_merge_request_path(@project, @merge_request), button_options: { aria: {label: edit_action_description, keyshortcuts: edit_action_shortcut}, class: "gl-hidden sm:gl-inline-flex gl-self-start has-tooltip js-issuable-edit", data: { html: "true", testid: "edit-title-button" }, title: edit_button_title }) do
           = _('Edit')
 
       .gl-flex.gl-flex-col.sm:gl-flex-row.gl-gap-3.gl-w-full.sm:gl-w-auto.gl-mt-2.sm:gl-mt-0
diff --git a/app/views/shared/milestones/_header.html.haml b/app/views/shared/milestones/_header.html.haml
index 5fc790e60c1a78fcc26ff09f7c05778c95d7a246..f3e6ff24d1940ef5cc20babd3337b694f871bb49 100644
--- a/app/views/shared/milestones/_header.html.haml
+++ b/app/views/shared/milestones/_header.html.haml
@@ -16,7 +16,7 @@
   .milestone-buttons.detail-page-header-actions.gl-flex.gl-self-start.gl-gap-3
     - if can_admin
       - if milestone.active?
-        = render Pajamas::ButtonComponent.new(href: update_milestone_path(milestone, { state_event: :close }), method: :put, button_options: { class: 'btn-close gl-hidden md:gl-inline-block' }) do
+        = render Pajamas::ButtonComponent.new(href: update_milestone_path(milestone, { state_event: :close }), method: :put, button_options: { class: 'btn-close gl-hidden md:gl-inline-flex' }) do
           = _('Close milestone')
       - else
         = render Pajamas::ButtonComponent.new(href: update_milestone_path(milestone, { state_event: :activate }), method: :put, button_options: { class: 'gl-hidden md:gl-inline-block' }) do
diff --git a/ee/app/assets/stylesheets/pages/trial_registrations.scss b/ee/app/assets/stylesheets/pages/trial_registrations.scss
index 4faf4014af8238d89df9d5d4452f03131244364f..1589329b4516617fe31603ae209825389a9de72c 100644
--- a/ee/app/assets/stylesheets/pages/trial_registrations.scss
+++ b/ee/app/assets/stylesheets/pages/trial_registrations.scss
@@ -13,7 +13,7 @@
     background-color: $brand-charcoal !important;
 
     &:not(:focus) {
-      box-shadow: inset 0 0 0 1px $brand-charcoal !important;
+      border-color: $brand-charcoal !important;
     }
 
     &:hover {