diff --git a/app/assets/stylesheets/page_bundles/project.scss b/app/assets/stylesheets/page_bundles/project.scss
index 68bf2fa0f822a55df8776d2ef91c45dfe6c6db0d..8d8da10268a6d0c4270913623ad6313511673685 100644
--- a/app/assets/stylesheets/page_bundles/project.scss
+++ b/app/assets/stylesheets/page_bundles/project.scss
@@ -47,12 +47,6 @@
 }
 
 .project-repo-buttons {
-  .btn {
-    svg {
-      fill: var(--gray-500, $gray-500);
-    }
-  }
-
   .download-button {
     @include media-breakpoint-down(md) {
       margin-left: 0;
diff --git a/app/components/pajamas/banner_component.html.haml b/app/components/pajamas/banner_component.html.haml
index 4fa2ed09cd359685e5ad0a653568de1c13180fb1..c2eeae2d8c94b84e5ef29824b375b483ed5dd63a 100644
--- a/app/components/pajamas/banner_component.html.haml
+++ b/app/components/pajamas/banner_component.html.haml
@@ -14,7 +14,7 @@
     - if primary_action?
       = primary_action
     - else
-      = link_to @button_text, @button_link, { **@button_options, class: 'btn btn-md btn-confirm gl-button js-close-callout' }
+      = link_button_to @button_text, @button_link, **@button_options, class: 'js-close-callout', variant: :confirm
 
     - actions.each do |action|
       = action
diff --git a/app/components/pajamas/banner_component.rb b/app/components/pajamas/banner_component.rb
index 6082762f22cd9fee81b5c4fb567407602bf00f6d..1a03f3fdd5807854c17d0ca257f285a086211195 100644
--- a/app/components/pajamas/banner_component.rb
+++ b/app/components/pajamas/banner_component.rb
@@ -49,7 +49,7 @@ def close_class
       end
     end
 
-    delegate :sprite_icon, to: :helpers
+    delegate :sprite_icon, :link_button_to, to: :helpers
 
     renders_one :title
     renders_one :illustration
diff --git a/app/views/admin/applications/_form.html.haml b/app/views/admin/applications/_form.html.haml
index a8d5a45041d792a5eb6bee6a0d7731ec6bf83c95..27622dfa0bbe78498c0be687dc2724332af6a4a3 100644
--- a/app/views/admin/applications/_form.html.haml
+++ b/app/views/admin/applications/_form.html.haml
@@ -32,4 +32,4 @@
 
   .gl-mt-5
     = f.submit _('Save application'), pajamas_button: true, data: { qa_selector: 'save_application_button' }
-    = link_to _('Cancel'), admin_applications_path, class: "gl-button btn btn-default btn-cancel"
+    = link_button_to _('Cancel'), admin_applications_path
diff --git a/app/views/admin/hooks/edit.html.haml b/app/views/admin/hooks/edit.html.haml
index b0e45f0a49fbfbb6d4f5803a0a916bc3fa493f29..f362cc9efbf44ef8ede909d2cdb3a0e79c3e3e7c 100644
--- a/app/views/admin/hooks/edit.html.haml
+++ b/app/views/admin/hooks/edit.html.haml
@@ -12,7 +12,7 @@
     %div
       = f.submit _('Save changes'), pajamas_button: true, class: 'gl-sm-mr-3'
       = render 'shared/web_hooks/test_button', hook: @hook
-      = link_to _('Delete'), admin_hook_path(@hook), method: :delete, class: 'btn gl-button btn-danger gl-float-right', aria: { label: s_('Webhooks|Delete webhook') }, data: { confirm: s_('Webhooks|Are you sure you want to delete this webhook?'), confirm_btn_variant: 'danger' }
+      = link_button_to _('Delete'), admin_hook_path(@hook), method: :delete, class: 'gl-float-right', aria: { label: s_('Webhooks|Delete webhook') }, data: { confirm: s_('Webhooks|Are you sure you want to delete this webhook?'), confirm_btn_variant: 'danger' }, variant: :danger
 
 %hr
 
diff --git a/app/views/admin/topics/_topic.html.haml b/app/views/admin/topics/_topic.html.haml
index ce2b5ad793c4fa318945fd7ff920f635e4889ce0..3e8a023ec9f1488a67d62bdeb00de5c9233cb271 100644
--- a/app/views/admin/topics/_topic.html.haml
+++ b/app/views/admin/topics/_topic.html.haml
@@ -16,5 +16,5 @@
       = number_with_delimiter(topic.total_projects_count)
 
   .controls.gl-flex-shrink-0.gl-ml-5
-    = link_to _('Edit'), edit_admin_topic_path(topic), id: "edit_#{dom_id(topic)}", class: 'btn gl-button btn-default'
-    = link_to _('Remove'), admin_topic_path(topic), aria: { label: _('Remove') }, data: { confirm: _("Are you sure you want to remove %{topic_name}?") % { topic_name: title }, confirm_btn_variant: 'danger' }, method: :delete, class: 'gl-button btn btn-danger'
+    = link_button_to _('Edit'), edit_admin_topic_path(topic), id: "edit_#{dom_id(topic)}"
+    = link_button_to _('Remove'), admin_topic_path(topic), aria: { label: _('Remove') }, data: { confirm: _("Are you sure you want to remove %{topic_name}?") % { topic_name: title }, confirm_btn_variant: 'danger' }, method: :delete, variant: :danger
diff --git a/app/views/admin/users/show.html.haml b/app/views/admin/users/show.html.haml
index 2fd477438e412aaa6f9fbe0782fdc87a9d110cf5..a4ae29bed81d5fcd1e0a20831481df2ee9253186 100644
--- a/app/views/admin/users/show.html.haml
+++ b/app/views/admin/users/show.html.haml
@@ -57,7 +57,7 @@
             %strong{ class: @user.two_factor_enabled? ? 'cgreen' : 'cred' }
               - if @user.two_factor_enabled?
                 = _('Enabled')
-                = link_to _('Disable'), disable_two_factor_admin_user_path(@user), aria: { label: _('Disable') }, data: { confirm: _('Are you sure?'), 'confirm-btn-variant': 'danger' }, method: :patch, class: 'btn gl-button btn-sm btn-danger float-right', title: _('Disable Two-factor Authentication')
+                = link_button_to _('Disable'), disable_two_factor_admin_user_path(@user), aria: { label: _('Disable') }, data: { confirm: _('Are you sure?'), 'confirm-btn-variant': 'danger' }, method: :patch, class: 'float-right', title: _('Disable Two-factor Authentication'), variant: :danger, size: :small
               - else
                 = _('Disabled')
 
diff --git a/app/views/explore/projects/topic.html.haml b/app/views/explore/projects/topic.html.haml
index bba0c1b9ca0c532d7b0785772eeb11b82fb20b9b..329e7cc161cec0961099f233aae64db2e50d851b 100644
--- a/app/views/explore/projects/topic.html.haml
+++ b/app/views/explore/projects/topic.html.haml
@@ -26,7 +26,6 @@
     .nav-controls
       = render 'shared/projects/search_form'
       = render 'filter'
-    = link_to topic_explore_projects_path(@topic.name, rss_url_options), title: s_("Topics|Subscribe to the new projects feed"), class: 'btn gl-button btn-default btn-icon d-none d-sm-inline-flex has-tooltip' do
-      = sprite_icon('rss', css_class: 'gl-icon')
+    = link_button_to nil, topic_explore_projects_path(@topic.name, rss_url_options), title: s_("Topics|Subscribe to the new projects feed"), class: 'd-none d-sm-inline-flex has-tooltip', icon: 'rss'
 
   = render 'projects', projects: @projects
diff --git a/app/views/groups/settings/_general.html.haml b/app/views/groups/settings/_general.html.haml
index 8c73fc955443b2aab9bedc2bdb71cc094048d52a..22ed6ea4403997afc22837d8ad02f84643d8fae1 100644
--- a/app/views/groups/settings/_general.html.haml
+++ b/app/views/groups/settings/_general.html.haml
@@ -33,7 +33,7 @@
     = render 'shared/choose_avatar_button', f: f
     - if @group.avatar?
       %hr
-      = link_to s_('Groups|Remove avatar'), group_avatar_path(@group.to_param), aria: { label: s_('Groups|Remove avatar') }, data: { confirm: s_('Groups|Avatar will be removed. Are you sure?'), 'confirm-btn-variant': 'danger' }, method: :delete, class: 'gl-button btn btn-danger-secondary'
+      = link_button_to s_('Groups|Remove avatar'), group_avatar_path(@group.to_param), aria: { label: s_('Groups|Remove avatar') }, data: { confirm: s_('Groups|Avatar will be removed. Are you sure?'), 'confirm-btn-variant': 'danger' }, method: :delete, variant: :danger, category: :secondary
   .form-group.gl-form-group
     = render 'shared/visibility_level', f: f, visibility_level: @group.visibility_level, can_change_visibility_level: can_change_group_visibility_level?(@group), form_model: @group
   = f.submit s_('Groups|Save changes'), pajamas_button: true, class: 'js-dirty-submit', data: { qa_selector: 'save_name_visibility_settings_button' }
diff --git a/app/views/invites/show.html.haml b/app/views/invites/show.html.haml
index 5f65405c8bc6754f8fa976ffc5fa29d021805be8..d368f013e6b5589b84be775083ab86098eef6e49 100644
--- a/app/views/invites/show.html.haml
+++ b/app/views/invites/show.html.haml
@@ -6,7 +6,7 @@
     %p
       = _("You are already a member of this %{member_source}.") % { member_source: @invite_details[:title] }
     .actions
-      = link_to _("Go to %{source_name}") % { source_name: @invite_details[:title] }, @invite_details[:url], class: "btn gl-button btn-confirm"
+      = link_button_to _("Go to %{source_name}") % { source_name: @invite_details[:title] }, @invite_details[:url], variant: :confirm
 
   - else
     %p
diff --git a/app/views/profiles/chat_names/_chat_name.html.haml b/app/views/profiles/chat_names/_chat_name.html.haml
index afc3894c23bb6f14c112a716597fecac1b04e638..0ac8ede3c6218731f456303597a115b140ecbc61 100644
--- a/app/views/profiles/chat_names/_chat_name.html.haml
+++ b/app/views/profiles/chat_names/_chat_name.html.haml
@@ -10,4 +10,4 @@
       = _('Never')
 
   %td
-    = link_to _('Remove'), profile_chat_name_path(chat_name), method: :delete, class: 'gl-button btn btn-danger float-right', aria: { label: _('Remove') }, data: { confirm: _('Are you sure you want to remove this nickname?'), confirm_btn_variant: 'danger' }
+    = link_button_to _('Remove'), profile_chat_name_path(chat_name), method: :delete, class: 'float-right', aria: { label: _('Remove') }, data: { confirm: _('Are you sure you want to remove this nickname?'), confirm_btn_variant: 'danger' }, variant: :danger
diff --git a/app/views/profiles/emails/index.html.haml b/app/views/profiles/emails/index.html.haml
index 41e061ebfee7a52be0eabf9c91b5eecb17898282..881ac7f2a7dcc6dda5d0167bf5b76c36b16a50c7 100644
--- a/app/views/profiles/emails/index.html.haml
+++ b/app/views/profiles/emails/index.html.haml
@@ -59,6 +59,6 @@
             .gl-display-flex.gl-justify-content-end.gl-align-items-flex-end.gl-flex-grow-1.gl-flex-wrap-reverse.gl-gap-3
               - unless email.confirmed?
                 - confirm_title = "#{email.confirmation_sent_at ? _('Resend confirmation email') : _('Send confirmation email')}"
-                = link_to confirm_title, resend_confirmation_instructions_profile_email_path(email), method: :put, class: 'gl-button btn btn-sm btn-default'
+                = link_button_to confirm_title, resend_confirmation_instructions_profile_email_path(email), method: :put, size: :small
 
               = link_button_to nil, profile_email_path(email), data: { confirm: _('Are you sure?'), qa_selector: 'delete_email_link'}, method: :delete, variant: :danger, size: :small, icon: 'remove', 'aria-label': _('Remove')
diff --git a/app/views/projects/_customize_workflow.html.haml b/app/views/projects/_customize_workflow.html.haml
index ded43a34b48e0fd2dda1565c88a59f4a3530dc69..da4b257f224aea99d1a8b3317bef5681b7012185 100644
--- a/app/views/projects/_customize_workflow.html.haml
+++ b/app/views/projects/_customize_workflow.html.haml
@@ -5,4 +5,4 @@
     %p
       Get started with GitLab by enabling features that work best for your project. From issues and wikis, to merge requests and pipelines, GitLab can help manage your workflow from idea to production!
     - if can?(current_user, :admin_project, @project)
-      = link_to "Get started", edit_project_path(@project), class: "gl-button btn btn-confirm"
+      = link_button_to "Get started", edit_project_path(@project), variant: :confirm
diff --git a/app/views/projects/_home_panel.html.haml b/app/views/projects/_home_panel.html.haml
index 9cb5ec39de269eed362a2fe647ac2589e62ebb23..591471388343e3cbbbe37f1d7e31d75b70175c9e 100644
--- a/app/views/projects/_home_panel.html.haml
+++ b/app/views/projects/_home_panel.html.haml
@@ -27,9 +27,7 @@
     .project-repo-buttons.gl-display-flex.gl-justify-content-md-end.gl-align-items-center.gl-flex-wrap.gl-gap-3
       - if current_user
         - if current_user.admin?
-          = link_to [:admin, @project], class: 'btn btn-default gl-button btn-icon', title: _('View project in admin area'),
-            data: {toggle: 'tooltip', placement: 'top', container: 'body'} do
-            = sprite_icon('admin')
+          = link_button_to nil, [:admin, @project], icon: 'admin', title: _('View project in admin area'), data: {toggle: 'tooltip', placement: 'top', container: 'body'}
         - if @notification_setting
           .js-vue-notification-dropdown{ data: { disabled: emails_disabled.to_s, dropdown_items: notification_dropdown_items(@notification_setting).to_json, notification_level: @notification_setting.level, help_page_path: help_page_path('user/profile/notifications'), project_id: @project.id, no_flip: 'true' } }
 
diff --git a/app/views/projects/_new_project_fields.html.haml b/app/views/projects/_new_project_fields.html.haml
index 6049d1cc11071276e3bc05ab1e79f2c8fd64e03a..983b80563589ec58132b1496cd80224dc2cf4a09 100644
--- a/app/views/projects/_new_project_fields.html.haml
+++ b/app/views/projects/_new_project_fields.html.haml
@@ -98,4 +98,4 @@
 -# this partial is from JiHu, see details in https://jihulab.com/gitlab-cn/gitlab/-/merge_requests/675
 = render_if_exists 'shared/other_project_options', f: f, visibility_level: visibility_level, track_label: track_label
 = f.submit _('Create project'), class: "js-create-project-button", data: { qa_selector: 'project_create_button', track_label: "#{track_label}", track_action: "click_button", track_property: "create_project", track_value: "" }, pajamas_button: true
-= link_to _('Cancel'), @parent_group || dashboard_groups_path, class: 'btn gl-button btn-default btn-cancel', data: { track_label: "#{track_label}", track_action: "click_button", track_property: "cancel", track_value: "" }
+= link_button_to _('Cancel'), @parent_group || dashboard_groups_path, data: { track_label: "#{track_label}", track_action: "click_button", track_property: "cancel", track_value: "" }
diff --git a/app/views/projects/_readme.html.haml b/app/views/projects/_readme.html.haml
index 85a53edc160f5ef0df0a00cd34401b14fda5270c..c3d6639625657d0d26e0d2ae714c15607ddc4e4c 100644
--- a/app/views/projects/_readme.html.haml
+++ b/app/views/projects/_readme.html.haml
@@ -24,4 +24,4 @@
         distributed with computer software, forming part of its documentation.
         GitLab will render it here instead of this message.
       %p
-        = link_to "Add Readme", @project.add_readme_path, class: 'gl-button btn btn-confirm'
+        = link_button_to "Add Readme", @project.add_readme_path, variant: :confirm
diff --git a/app/views/projects/_wiki.html.haml b/app/views/projects/_wiki.html.haml
index 45d0aee43326b0cd6f0260d3891397f331114c6c..e82e0972d8232ffb0e894124be3dd3a4f6ec16f5 100644
--- a/app/views/projects/_wiki.html.haml
+++ b/app/views/projects/_wiki.html.haml
@@ -14,4 +14,4 @@
       - if can_create_wiki
         %p
           = _("Add a homepage to your wiki that contains information about your project and GitLab will display it here instead of this message.")
-        = link_to _("Create your first page"), wiki_path(@project.wiki) + '?view=create', class: "btn gl-button btn-confirm"
+        = link_button_to _("Create your first page"), wiki_path(@project.wiki) + '?view=create', variant: :confirm
diff --git a/app/views/projects/blob/_new_dir.html.haml b/app/views/projects/blob/_new_dir.html.haml
index 3ae7741d24d68a2ab922db128cf86506a909eb3a..f1da9154df9f253b747af24e9187260a6e025fac 100644
--- a/app/views/projects/blob/_new_dir.html.haml
+++ b/app/views/projects/blob/_new_dir.html.haml
@@ -16,6 +16,6 @@
 
           .form-actions
             = submit_tag _("Create directory"), class: 'btn gl-button btn-confirm'
-            = link_to _('Cancel'), '#', class: "btn gl-button btn-default btn-cancel", "data-dismiss" => "modal"
+            = link_button_to _('Cancel'), '#', "data-dismiss" => "modal"
 
             = render 'shared/projects/edit_information'
diff --git a/app/views/projects/branches/new.html.haml b/app/views/projects/branches/new.html.haml
index 9fd9943fd26702318fe1e8e798fb286cd363f276..7f6a37fc2108b917bf74d2a2804a2cdb397d251d 100644
--- a/app/views/projects/branches/new.html.haml
+++ b/app/views/projects/branches/new.html.haml
@@ -20,4 +20,4 @@
       = _('Existing branch name, tag, or commit SHA')
   = render Pajamas::ButtonComponent.new(variant: :confirm, button_options: { type: 'submit', class: 'gl-mr-3' }) do
     = _('Create branch')
-  = link_to _('Cancel'), project_branches_path(@project), class: 'gl-button btn btn-default btn-cancel'
+  = link_button_to _('Cancel'), project_branches_path(@project)
diff --git a/app/views/projects/buttons/_download_links.html.haml b/app/views/projects/buttons/_download_links.html.haml
index d36aed44e18a0564fe4e30cd2e2fe85171f9b8ac..31185fc153215e01afee2e0bb92d2731e5af5602 100644
--- a/app/views/projects/buttons/_download_links.html.haml
+++ b/app/views/projects/buttons/_download_links.html.haml
@@ -1,4 +1,4 @@
 .btn-group.ml-0.w-100
   - Gitlab::Workhorse::ARCHIVE_FORMATS.each_with_index do |fmt, index|
     - archive_path = project_archive_path(project, id: tree_join(ref, archive_prefix), path: path, format: fmt)
-    = link_to fmt, external_storage_url_or_path(archive_path), rel: 'nofollow', download: '', class: "gl-button btn btn-sm #{index == 0 ? 'btn-confirm' : 'btn-default'}"
+    = link_button_to fmt, external_storage_url_or_path(archive_path), rel: 'nofollow', download: '', variant: index == 0 ? :confirm : :default, size: :small
diff --git a/app/views/projects/commit/_commit_box.html.haml b/app/views/projects/commit/_commit_box.html.haml
index c161e1c9d2a1ff1d27f68278254b7f87e2f3224f..24d063d3b4d0afa593110d99f51c128c510dfbe8 100644
--- a/app/views/projects/commit/_commit_box.html.haml
+++ b/app/views/projects/commit/_commit_box.html.haml
@@ -19,7 +19,7 @@
       #{time_ago_with_tooltip(@commit.committed_date)}
 
   #js-commit-comments-button{ data: { comments_count: @notes_count.to_i } }
-  = link_to _('Browse files'), project_tree_path(@project, @commit), class: "btn gl-button btn-default gl-mr-3 gl-xs-w-full gl-xs-mb-3"
+  = link_button_to _('Browse files'), project_tree_path(@project, @commit), class: 'gl-mr-3 gl-xs-w-full gl-xs-mb-3'
   #js-commit-options-dropdown{ data: commit_options_dropdown_data(@project, @commit) }
 
 .commit-box{ data: { project_path: project_path(@project) } }
diff --git a/app/views/projects/deploy_keys/edit.html.haml b/app/views/projects/deploy_keys/edit.html.haml
index 91444a0033476f972a1239e36ff1b82229b33bd3..997443d5fa96a16a8199e3d6686e6f364344cc2f 100644
--- a/app/views/projects/deploy_keys/edit.html.haml
+++ b/app/views/projects/deploy_keys/edit.html.haml
@@ -7,4 +7,4 @@
     = render partial: 'shared/deploy_keys/form', locals: { form: f, deploy_key: @deploy_key }
     .form-actions
       = f.submit _('Save changes'), pajamas_button: true
-      = link_to _('Cancel'), project_settings_repository_path(@project), class: 'gl-button btn btn-default btn-cancel'
+      = link_button_to _('Cancel'), project_settings_repository_path(@project)
diff --git a/app/views/projects/diffs/_diffs.html.haml b/app/views/projects/diffs/_diffs.html.haml
index 982ecbbae51d294f68f23651bdc597d7d7f09d20..9193fc4ef25361cc91589b63f5a4d3c21eb4b3f4 100644
--- a/app/views/projects/diffs/_diffs.html.haml
+++ b/app/views/projects/diffs/_diffs.html.haml
@@ -12,7 +12,7 @@
   .files-changed-inner
     .inline-parallel-buttons.gl-display-none.gl-md-display-flex.gl-relative
       - if !diffs_expanded? && diff_files.any?(&:collapsed?)
-        = link_to _('Expand all'), url_for(safe_params.merge(expanded: 1, format: nil)), class: 'gl-button btn btn-default'
+        = link_button_to _('Expand all'), url_for(safe_params.merge(expanded: 1, format: nil))
       - if show_whitespace_toggle
         - if current_controller?(:commit)
           = commit_diff_whitespace_link(diffs.project, @commit, class: 'd-none d-sm-inline-block')
diff --git a/app/views/projects/forks/error.html.haml b/app/views/projects/forks/error.html.haml
index cff5899b960a244e650a4ba30400155e3b9686a6..f589c8f9566e9114ddcdad7b2d26e05ff1141841 100644
--- a/app/views/projects/forks/error.html.haml
+++ b/app/views/projects/forks/error.html.haml
@@ -18,4 +18,4 @@
             = error
 
     - c.with_actions do
-      = link_to _('Try to fork again'), new_project_fork_path(@project), title: _("Fork"), class: "btn gl-alert-action btn-info btn-md gl-button"
+      = link_button_to _('Try to fork again'), new_project_fork_path(@project), title: _("Fork"), class: 'gl-alert-action', variant: :confirm
diff --git a/app/views/projects/hook_logs/show.html.haml b/app/views/projects/hook_logs/show.html.haml
index 0f4dc4b5e325f2aeb24f9d6caa56af97779088be..30084e3310b5e0987bef04243038ccdcfd3231bd 100644
--- a/app/views/projects/hook_logs/show.html.haml
+++ b/app/views/projects/hook_logs/show.html.haml
@@ -9,6 +9,6 @@
 - if @hook_log.oversize?
   = button_tag _("Resend Request"), class: "btn gl-button btn-default float-right gl-ml-3 has-tooltip", disabled: true, title: _("Request data is too large")
 - else
-  = link_to _("Resend Request"), @hook_log.present.retry_path, method: :post, class: "btn gl-button btn-default float-right gl-ml-3"
+  = link_button_to _("Resend Request"), @hook_log.present.retry_path, method: :post, class: 'float-right gl-ml-3'
 
 = render partial: 'shared/hook_logs/content', locals: { hook_log: @hook_log }
diff --git a/app/views/projects/hooks/edit.html.haml b/app/views/projects/hooks/edit.html.haml
index b410b6c07e19180dd48caa08d42a09adba89273f..26ec09c76dba5a4734c0a93cae3d886e9bb2687a 100644
--- a/app/views/projects/hooks/edit.html.haml
+++ b/app/views/projects/hooks/edit.html.haml
@@ -12,7 +12,7 @@
     %div
       = f.submit _('Save changes'), pajamas_button: true, class: 'gl-sm-mr-3'
       = render 'shared/web_hooks/test_button', hook: @hook
-      = link_to _('Delete'), project_hook_path(@project, @hook), method: :delete, class: 'btn gl-button btn-danger gl-float-right', aria: { label: s_('Webhooks|Delete webhook') }, data: { confirm: s_('Webhooks|Are you sure you want to delete this project hook?'), confirm_btn_variant: 'danger' }
+      = link_button_to _('Delete'), project_hook_path(@project, @hook), method: :delete, class: 'gl-float-right', aria: { label: s_('Webhooks|Delete webhook') }, data: { confirm: s_('Webhooks|Are you sure you want to delete this project hook?'), confirm_btn_variant: 'danger' }, variant: :danger
 
 %hr
 
diff --git a/app/views/projects/issues/service_desk/_service_desk_empty_state.html.haml b/app/views/projects/issues/service_desk/_service_desk_empty_state.html.haml
index 855625368a9cdc422c51d58a20ff0460920c744f..831bd107961a456053328de56150cd6dddc32e65 100644
--- a/app/views/projects/issues/service_desk/_service_desk_empty_state.html.haml
+++ b/app/views/projects/issues/service_desk/_service_desk_empty_state.html.haml
@@ -21,7 +21,7 @@
 
       - if can_edit_project_settings && !service_desk_enabled
         .text-center
-          = link_to s_("ServiceDesk|Enable Service Desk"), edit_project_path(@project), class: 'gl-button btn btn-confirm'
+          = link_button_to s_("ServiceDesk|Enable Service Desk"), edit_project_path(@project), variant: :confirm
 - else
   .empty-state
     .svg-content
diff --git a/app/views/projects/issues/service_desk/_service_desk_info_content.html.haml b/app/views/projects/issues/service_desk/_service_desk_info_content.html.haml
index 95837748c7fb42157fc2aff0c927044c26825783..093a47e63be7fb03c5944a77e4e20f57f430d467 100644
--- a/app/views/projects/issues/service_desk/_service_desk_info_content.html.haml
+++ b/app/views/projects/issues/service_desk/_service_desk_info_content.html.haml
@@ -21,4 +21,4 @@
 
     - if can_edit_project_settings && !service_desk_enabled
       .gl-mt-3
-        = link_to s_("ServiceDesk|Enable Service Desk"), edit_project_path(@project), class: 'gl-button btn btn-confirm'
+        = link_button_to s_("ServiceDesk|Enable Service Desk"), edit_project_path(@project), variant: :confirm
diff --git a/app/views/projects/mattermosts/_no_teams.html.haml b/app/views/projects/mattermosts/_no_teams.html.haml
index 5886c0565b1dc5d1ccc516080e24bde7b01c7512..c53e805fae1aba7a6782f25f0801066d3ed7acf4 100644
--- a/app/views/projects/mattermosts/_no_teams.html.haml
+++ b/app/views/projects/mattermosts/_no_teams.html.haml
@@ -9,4 +9,4 @@
   and try again.
 %hr
 .clearfix
-  = link_to 'Go back', edit_project_settings_integration_path(@project, @integration), class: 'gl-button btn btn-lg float-right'
+  = link_button_to 'Go back', edit_project_settings_integration_path(@project, @integration), class: 'float-right'
diff --git a/app/views/projects/milestones/_form.html.haml b/app/views/projects/milestones/_form.html.haml
index be6f9ac83dc5c5c58135e2cda3ce063f9b758e2d..98389d95392e96f6581ce188328d52dc0e4cfe0b 100644
--- a/app/views/projects/milestones/_form.html.haml
+++ b/app/views/projects/milestones/_form.html.haml
@@ -26,7 +26,7 @@
 
   - if @milestone.new_record?
     = f.submit _('Create milestone'), data: { qa_selector: 'create_milestone_button' }, class: 'gl-mr-2', pajamas_button: true
-    = link_to _('Cancel'), project_milestones_path(@project), class: 'gl-button btn btn-default btn-cancel'
+    = link_button_to _('Cancel'), project_milestones_path(@project)
   - else
     = f.submit _('Save changes'), class: 'gl-mr-2', pajamas_button: true
-    = link_to _('Cancel'), project_milestone_path(@project, @milestone), class: 'gl-button btn btn-default btn-cancel'
+    = link_button_to _('Cancel'), project_milestone_path(@project, @milestone)
diff --git a/app/views/projects/no_repo.html.haml b/app/views/projects/no_repo.html.haml
index 5cc909741f6aa8d09318b3a4199855d69b7af5ea..3abec75b971f3babf799de917b99a8392fb130fd 100644
--- a/app/views/projects/no_repo.html.haml
+++ b/app/views/projects/no_repo.html.haml
@@ -23,4 +23,4 @@
 
 - if can? current_user, :remove_project, @project
   .prepend-top-20
-    = link_to _('Delete project'), project_path(@project), data: { confirm: remove_project_message(@project), confirm_btn_variant: 'danger' }, aria: { label: _('Delete project') }, method: :delete, class: "btn gl-button btn-danger float-right"
+    = link_button_to _('Delete project'), project_path(@project), data: { confirm: remove_project_message(@project), confirm_btn_variant: 'danger' }, aria: { label: _('Delete project') }, method: :delete, class: 'float-right', variant: :danger
diff --git a/app/views/projects/pages/_list.html.haml b/app/views/projects/pages/_list.html.haml
index 57371aa49f6ea72e779dcd88607515236507f203..38e15d02a3964ecab13d54faa2bdc2b1bcb509cb 100644
--- a/app/views/projects/pages/_list.html.haml
+++ b/app/views/projects/pages/_list.html.haml
@@ -26,8 +26,8 @@
                       - if domain.expired?
                         = gl_badge_tag s_('GitLabPages|Expired'), variant: :danger
               %div
-                = link_to s_('GitLabPages|Edit'), project_pages_domain_path(@project, domain), class: "btn gl-button btn-sm btn-grouped btn-confirm btn-inverted"
-                = link_to s_('GitLabPages|Remove'), project_pages_domain_path(@project, domain), data: { confirm: s_('GitLabPages|Are you sure?'), 'confirm-btn-variant': 'danger'}, "aria-label": s_("GitLabPages|Remove domain"), method: :delete, class: "btn gl-button btn-danger btn-sm btn-grouped"
+                = link_button_to s_('GitLabPages|Edit'), project_pages_domain_path(@project, domain), class: 'btn-grouped', variant: :confirm, category: :secondary, size: :small
+                = link_button_to s_('GitLabPages|Remove'), project_pages_domain_path(@project, domain), data: { confirm: s_('GitLabPages|Are you sure?'), 'confirm-btn-variant': 'danger'}, "aria-label": s_("GitLabPages|Remove domain"), method: :delete, class: 'btn-grouped', variant: :danger, size: :small
             - if domain.needs_verification?
               %li.list-group-item.bs-callout-warning
                 - details_link_start = "<a href='#{project_pages_domain_path(@project, domain)}'>".html_safe
diff --git a/app/views/projects/pages_domains/_dns.html.haml b/app/views/projects/pages_domains/_dns.html.haml
index eff8f9298fd5e7471773bdb8218239b3cfb84e2b..7c34c3ff6e1d1c8d65f72029960a46cfc60d3eb4 100644
--- a/app/views/projects/pages_domains/_dns.html.haml
+++ b/app/views/projects/pages_domains/_dns.html.haml
@@ -21,7 +21,7 @@
         .gl-mb-3
           - text, status = domain_presenter.unverified? ? [_('Unverified'), :danger] : [_('Verified'), :success]
           = gl_badge_tag text, variant: status
-          = link_to sprite_icon("redo"), verify_project_pages_domain_path(@project, domain_presenter), method: :post, class: "gl-ml-2 gl-button btn btn-sm btn-default has-tooltip", title: _("Retry verification")
+          = link_button_to sprite_icon("redo"), verify_project_pages_domain_path(@project, domain_presenter), method: :post, class: 'gl-ml-2 has-tooltip', title: _("Retry verification"), size: :small
         .input-group
           = text_field_tag :domain_verification, domain_presenter.verification_record, class: "monospace js-select-on-focus form-control", readonly: true
           .input-group-append
diff --git a/app/views/projects/pages_domains/_lets_encrypt_callout.html.haml b/app/views/projects/pages_domains/_lets_encrypt_callout.html.haml
index d6c213571f21c8160e8604185115fa2b22dea0b7..68b6884c4f56cd4ab3c668c516a0342e489f4e8d 100644
--- a/app/views/projects/pages_domains/_lets_encrypt_callout.html.haml
+++ b/app/views/projects/pages_domains/_lets_encrypt_callout.html.haml
@@ -9,7 +9,7 @@
                 = sprite_icon('warning-solid', css_class: ' mr-2 gl-text-orange-600')
                 = _("Something went wrong while obtaining the Let's Encrypt certificate.")
               .row.mx-0.mt-3
-                = link_to s_('GitLabPagesDomains|Retry'), retry_auto_ssl_project_pages_domain_path(@project, domain_presenter), class: "gl-button btn btn-default btn-sm btn-grouped", method: :post
+                = link_button_to s_('GitLabPagesDomains|Retry'), retry_auto_ssl_project_pages_domain_path(@project, domain_presenter), class: 'btn-grouped', method: :post, size: :small
     - elsif !domain_presenter.certificate_gitlab_provided?
       .form-group.border-section.js-shown-if-auto-ssl{ class: ("d-none" unless auto_ssl_available_and_enabled) }
         .row
diff --git a/app/views/projects/pages_domains/new.html.haml b/app/views/projects/pages_domains/new.html.haml
index c88255e23f975f1e7e90a1cd1cb7103c459d6132..c58209f880634a68562cf4cad64b5070e281c5d8 100644
--- a/app/views/projects/pages_domains/new.html.haml
+++ b/app/views/projects/pages_domains/new.html.haml
@@ -8,4 +8,4 @@
     = render 'form', { f: f }
     .form-actions.gl-display-flex
       = f.submit _('Create New Domain'), class: 'gl-mr-3', pajamas_button: true
-      = link_to _('Cancel'), project_pages_path(@project), class: 'gl-button btn btn-default btn-cancel'
+      = link_button_to _('Cancel'), project_pages_path(@project)
diff --git a/app/views/projects/pages_domains/show.html.haml b/app/views/projects/pages_domains/show.html.haml
index b8de364babc04c3e67bdcb7d29f2d6a65ecbfeff..d34650d3f5a0ccb344dc794fcd7e54b06650ca2a 100644
--- a/app/views/projects/pages_domains/show.html.haml
+++ b/app/views/projects/pages_domains/show.html.haml
@@ -10,4 +10,4 @@
     = render 'form', { f: f }
     .form-actions.gl-display-flex
       = f.submit _('Save Changes'), class: 'gl-mr-3', pajamas_button: true
-      = link_to _('Cancel'), project_pages_path(@project), class: 'gl-button btn btn-default btn-inverse'
+      = link_button_to _('Cancel'), project_pages_path(@project)
diff --git a/app/views/projects/protected_tags/shared/_index.html.haml b/app/views/projects/protected_tags/shared/_index.html.haml
index 11e09d843e0d1ca491f32ab759d64d28a086f301..a016ccf865694a1a283523f7879b2aa65d8c61d8 100644
--- a/app/views/projects/protected_tags/shared/_index.html.haml
+++ b/app/views/projects/protected_tags/shared/_index.html.haml
@@ -8,7 +8,7 @@
       = expanded ? _('Collapse') : _('Expand')
     %p
       = s_("ProtectedTag|Limit access to creating and updating tags.")
-      =  link_to s_("ProtectedTag|What are protected tags?"), help_page_path("user/project/protected_tags")
+      = link_to s_("ProtectedTag|What are protected tags?"), help_page_path("user/project/protected_tags")
   .settings-content
     %p
       = s_("ProtectedTag|By default, protected tags restrict who can modify the tag.")
diff --git a/app/views/projects/protected_tags/shared/_protected_tag.html.haml b/app/views/projects/protected_tags/shared/_protected_tag.html.haml
index ed5b5b1794258eeb8d9dd83ca3128a1d876f6492..4fe1c8bd3cb0c2e5220b4fa77dfaf7f1095b1232 100644
--- a/app/views/projects/protected_tags/shared/_protected_tag.html.haml
+++ b/app/views/projects/protected_tags/shared/_protected_tag.html.haml
@@ -19,4 +19,4 @@
 
   - if can? current_user, :admin_project, @project
     %td
-      = link_to 'Unprotect', [@project, protected_tag, { update_section: 'js-protected-tags-settings' }], aria: { label: s_('ProtectedTags|Unprotect tag') }, data: { confirm: 'Tag will be writable for developers. Are you sure?', confirm_btn_variant: 'danger' }, method: :delete, class: 'gl-button btn btn-danger-secondary'
+      = link_button_to 'Unprotect', [@project, protected_tag, { update_section: 'js-protected-tags-settings' }], aria: { label: s_('ProtectedTags|Unprotect tag') }, data: { confirm: 'Tag will be writable for developers. Are you sure?', confirm_btn_variant: 'danger' }, method: :delete, variant: :danger, category: :secondary
diff --git a/app/views/projects/runners/_runner.html.haml b/app/views/projects/runners/_runner.html.haml
index 6d60370d2e05d916cec5b6330d15cb44a7d36e52..12432cd3484c63130cbb9e87ab13e4580aad5bde 100644
--- a/app/views/projects/runners/_runner.html.haml
+++ b/app/views/projects/runners/_runner.html.haml
@@ -19,10 +19,10 @@
           - else
             = link_button_to nil, resume_project_runner_path(@project, runner), method: :post, title: s_('Runners|Resume accepting jobs'), aria: { label: _('Resume') }, data: { toggle: 'tooltip', container: 'body' }, icon: 'play'
           - if runner.belongs_to_one_project?
-            = link_to _('Remove runner'), project_runner_path(@project, runner), aria: { label: _('Remove') }, data: { confirm: _("Are you sure?"), 'confirm-btn-variant': 'danger' }, method: :delete, class: 'btn gl-button btn-danger'
+            = link_button_to _('Remove runner'), project_runner_path(@project, runner), aria: { label: _('Remove') }, data: { confirm: _("Are you sure?"), 'confirm-btn-variant': 'danger' }, method: :delete, variant: :danger
           - else
             - runner_project = @project.runner_projects.find_by(runner_id: runner) # rubocop: disable CodeReuse/ActiveRecord
-            = link_to _('Disable for this project'), project_runner_project_path(@project, runner_project), aria: { label: _('Disable') }, data: { confirm: _("Are you sure?"), 'confirm-btn-variant': 'danger' }, method: :delete, class: 'btn gl-button btn-danger'
+            = link_button_to _('Disable for this project'), project_runner_project_path(@project, runner_project), aria: { label: _('Disable') }, data: { confirm: _("Are you sure?"), 'confirm-btn-variant': 'danger' }, method: :delete, variant: :danger
         - elsif runner.project_type?
           = form_for [@project, @project.runner_projects.new] do |f|
             = f.hidden_field :runner_id, value: runner.id
diff --git a/app/views/projects/settings/_general.html.haml b/app/views/projects/settings/_general.html.haml
index 847f9ad3e2ab791e82704a2f4cd1bd27fd4f79c8..f5c275827fcfa7724651425ef39f4080a346e02f 100644
--- a/app/views/projects/settings/_general.html.haml
+++ b/app/views/projects/settings/_general.html.haml
@@ -35,6 +35,6 @@
     = render 'shared/choose_avatar_button', f: f
     - if @project.avatar?
       %hr
-      = link_to _('Remove avatar'), project_avatar_path(@project), aria: { label: _('Remove avatar') }, data: { confirm: _('Avatar will be removed. Are you sure?'), 'confirm-btn-variant': 'danger' }, method: :delete, class: 'gl-button btn btn-danger-secondary'
+      = link_button_to _('Remove avatar'), project_avatar_path(@project), aria: { label: _('Remove avatar') }, data: { confirm: _('Avatar will be removed. Are you sure?'), 'confirm-btn-variant': 'danger' }, method: :delete, variant: :danger, category: :secondary
 
   = f.submit _('Save changes'), pajamas_button: true, class: "gl-mt-6", data: { qa_selector: 'save_naming_topics_avatar_button' }
diff --git a/app/views/projects/settings/slacks/edit.html.haml b/app/views/projects/settings/slacks/edit.html.haml
index 867b90655e3d7100b4307c833c16a885862314e9..537ae767b1ddb43bc0deb4a2bf28e77a70b4139a 100644
--- a/app/views/projects/settings/slacks/edit.html.haml
+++ b/app/views/projects/settings/slacks/edit.html.haml
@@ -17,4 +17,4 @@
       .footer-block.row-content-block
         = form.submit _('Save changes'), pajamas_button: true
         &nbsp;
-        = link_to _('Cancel'), edit_project_settings_integration_path(@project, @service), class: 'btn gl-button btn-cancel'
+        = link_button_to _('Cancel'), edit_project_settings_integration_path(@project, @service)
diff --git a/app/views/projects/snippets/index.html.haml b/app/views/projects/snippets/index.html.haml
index 7c936c849d0851456cf93fabccf28bce4e374b02..ae9a8307eb936c93c902d9a6b3ca3adfc369c8e4 100644
--- a/app/views/projects/snippets/index.html.haml
+++ b/app/views/projects/snippets/index.html.haml
@@ -9,7 +9,7 @@
 
       - if new_project_snippet_link.present?
         .nav-controls
-          = link_to _("New snippet"), new_project_snippet_link, class: "gl-button btn btn-confirm", title: _("New snippet")
+          = link_button_to _("New snippet"), new_project_snippet_link, title: _("New snippet"), variant: :confirm
 
   = render 'shared/snippets/list'
 - else
diff --git a/app/views/protected_branches/shared/_protected_branch.html.haml b/app/views/protected_branches/shared/_protected_branch.html.haml
index c2a5dd8a9b0991c8a2ecf90ae37be22110751659..69969b7f8485595c9376382ca26376be2b9628c2 100644
--- a/app/views/protected_branches/shared/_protected_branch.html.haml
+++ b/app/views/protected_branches/shared/_protected_branch.html.haml
@@ -27,4 +27,4 @@
         %span.has-tooltip{ data: { container: 'body' }, title: s_('ProtectedBranch|Inherited - This setting can be changed at the group level'), 'aria-hidden': 'true' }
           = sprite_icon 'lock'
       - else
-        = link_to s_('ProtectedBranch|Unprotect'), [protected_branch_entity, protected_branch, { update_section: 'js-protected-branches-settings' }], disabled: local_assigns[:disabled], aria: { label: s_('ProtectedBranch|Unprotect branch') }, data: { confirm: s_('ProtectedBranch|Branch will be writable for developers. Are you sure?'), confirm_btn_variant: 'danger' }, method: :delete, class: "btn gl-button btn-danger btn-sm"
+        = link_button_to s_('ProtectedBranch|Unprotect'), [protected_branch_entity, protected_branch, { update_section: 'js-protected-branches-settings' }], disabled: local_assigns[:disabled], aria: { label: s_('ProtectedBranch|Unprotect branch') }, data: { confirm: s_('ProtectedBranch|Branch will be writable for developers. Are you sure?'), confirm_btn_variant: 'danger' }, method: :delete, variant: :danger, size: :small
diff --git a/app/views/sent_notifications/unsubscribe.html.haml b/app/views/sent_notifications/unsubscribe.html.haml
index 03b030eb2575bf7a0f456fbf7a758cbbaba0f3fb..16e4ff4d17f65e231a2989357daabb69e2662c53 100644
--- a/app/views/sent_notifications/unsubscribe.html.haml
+++ b/app/views/sent_notifications/unsubscribe.html.haml
@@ -16,4 +16,4 @@
 %p
   = link_to _('Unsubscribe'), unsubscribe_sent_notification_path(@sent_notification, force: true),
             class: 'gl-button btn btn-confirm gl-mr-3'
-  = link_to _('Cancel'), new_user_session_path, class: 'gl-button btn gl-mr-3'
+  = link_button_to _('Cancel'), new_user_session_path, class: 'gl-mr-3'
diff --git a/app/views/shared/_auto_devops_implicitly_enabled_banner.html.haml b/app/views/shared/_auto_devops_implicitly_enabled_banner.html.haml
index f4af3ea70d42fbb763d2ac9e55d13adffce8428f..79a9bafc4f0bc576ba993db743a7d395b5ce8f4f 100644
--- a/app/views/shared/_auto_devops_implicitly_enabled_banner.html.haml
+++ b/app/views/shared/_auto_devops_implicitly_enabled_banner.html.haml
@@ -8,5 +8,5 @@
         %div
           = _('Container registry is not enabled on this GitLab instance. Ask an administrator to enable it in order for Auto DevOps to work.')
     - c.with_actions do
-      = link_to _('Settings'), project_settings_ci_cd_path(project), class: 'alert-link btn gl-button btn-confirm'
-      = link_to _('More information'), help_page_path('topics/autodevops/index.md'), target: '_blank', class: 'alert-link btn gl-button btn-default gl-ml-3'
+      = link_button_to _('Settings'), project_settings_ci_cd_path(project), class: 'alert-link', variant: :confirm
+      = link_button_to _('More information'), help_page_path('topics/autodevops/index.md'), target: '_blank', class: 'alert-link gl-ml-3'
diff --git a/app/views/shared/_no_ssh.html.haml b/app/views/shared/_no_ssh.html.haml
index e9c0858e0908b1c9a09986c450c44de2a9e5df15..a3f24da5d7cf95872868eb618cd9dec8d3b2b59c 100644
--- a/app/views/shared/_no_ssh.html.haml
+++ b/app/views/shared/_no_ssh.html.haml
@@ -5,5 +5,5 @@
     - c.with_body do
       = s_("MissingSSHKeyWarningLink|You can't push or pull repositories using SSH until you add an SSH key to your profile.")
     - c.with_actions do
-      = link_to s_('MissingSSHKeyWarningLink|Add SSH key'), profile_keys_path, class: "gl-alert-action btn btn-confirm btn-md gl-button"
-      = link_to s_("MissingSSHKeyWarningLink|Don't show again"), profile_path(user: { hide_no_ssh_key: true }), method: :put, role: 'button', class: 'gl-alert-action btn btn-default btn-md gl-button'
+      = link_button_to s_('MissingSSHKeyWarningLink|Add SSH key'), profile_keys_path, class: 'gl-alert-action', variant: :confirm
+      = link_button_to s_("MissingSSHKeyWarningLink|Don't show again"), profile_path(user: { hide_no_ssh_key: true }), method: :put, role: 'button', class: 'gl-alert-action'
diff --git a/app/views/shared/_project_limit.html.haml b/app/views/shared/_project_limit.html.haml
index ce49193e27bccce2d9efd6aab533c542a58e1c3a..a99db32c40eb0c59bddc3216170a4173d9fc5fe6 100644
--- a/app/views/shared/_project_limit.html.haml
+++ b/app/views/shared/_project_limit.html.haml
@@ -5,5 +5,5 @@
     - c.with_body do
       = _("You won't be able to create new projects because you have reached your project limit.")
     - c.with_actions do
-      = link_to _('Remind later'), '#', class: 'alert-link hide-project-limit-message btn gl-button btn-confirm'
-      = link_to _("Don't show again"), profile_path(user: {hide_project_limit: true}), method: :put, class: 'alert-link btn gl-button btn-default gl-ml-3'
+      = link_button_to _('Remind later'), '#', class: 'alert-link hide-project-limit-message', variant: :confirm
+      = link_button_to _("Don't show again"), profile_path(user: {hide_project_limit: true}), method: :put, class: 'alert-link gl-ml-3'
diff --git a/app/views/shared/_prometheus_configuration_banner.html.haml b/app/views/shared/_prometheus_configuration_banner.html.haml
index 2d948cf28a63a50aa1970e5de084fb49e2fc9879..7469260a9973b561fb5609d3a351f6be4241f92d 100644
--- a/app/views/shared/_prometheus_configuration_banner.html.haml
+++ b/app/views/shared/_prometheus_configuration_banner.html.haml
@@ -17,11 +17,11 @@
         .col-sm-10
           %p.text-success.gl-mt-3
             = s_('PrometheusService|You have a cluster with the Prometheus integration enabled.')
-          = link_to s_('PrometheusService|Manage clusters'), project_clusters_path(project), class: 'btn gl-button btn-default'
+          = link_button_to s_('PrometheusService|Manage clusters'), project_clusters_path(project)
       - else
         .col-sm-2
           = image_tag 'illustrations/monitoring/loading.svg'
         .col-sm-10
           %p.gl-mt-3
             = s_('PrometheusService|Configure GitLab to query a Prometheus installed in one of your clusters.')
-          = link_to s_('PrometheusService|Manage clusters'), project_clusters_path(project), class: 'btn gl-button btn-confirm'
+          = link_button_to s_('PrometheusService|Manage clusters'), project_clusters_path(project), variant: :confirm
diff --git a/app/views/shared/doorkeeper/applications/_show.html.haml b/app/views/shared/doorkeeper/applications/_show.html.haml
index b9095e2a1a1178f1ad1097b3c9f8ec0df86dc238..b075cece87775b8cb8aa73c183586dc16165ac56 100644
--- a/app/views/shared/doorkeeper/applications/_show.html.haml
+++ b/app/views/shared/doorkeeper/applications/_show.html.haml
@@ -43,8 +43,8 @@
 .form-actions.gl-display-flex.gl-justify-content-space-between
   %div
     - if @created
-      = link_to _('Continue'), index_path, class: 'btn btn-confirm btn-md gl-button gl-mr-3'
-    = link_to _('Edit'), edit_path, class: 'btn btn-default btn-md gl-button'
+      = link_button_to _('Continue'), index_path, class: 'gl-mr-3', variant: :confirm
+    = link_button_to _('Edit'), edit_path
   = render 'shared/doorkeeper/applications/delete_form', path: delete_path
 
 -# Create a hidden field to save the ID of application created
diff --git a/app/views/shared/empty_states/_issues.html.haml b/app/views/shared/empty_states/_issues.html.haml
index 387a83873b5a05c1209e681666414ed61e562e94..a4ea98a0fb71209be7d436a3452e200bf344e603 100644
--- a/app/views/shared/empty_states/_issues.html.haml
+++ b/app/views/shared/empty_states/_issues.html.haml
@@ -19,7 +19,7 @@
           = _("To widen your search, change or remove filters above")
         - if show_new_issue_link?(@project)
           .text-center
-            = link_to _("New issue"), new_project_issue_path(@project), class: "gl-button btn btn-confirm"
+            = link_button_to _("New issue"), new_project_issue_path(@project), variant: :confirm
       - elsif is_opened_state && opened_issues_count == 0 && closed_issues_count > 0
         %h4.text-center
           = _("There are no open issues")
@@ -27,7 +27,7 @@
           = _("To keep this project going, create a new issue")
         - if show_new_issue_link?(@project)
           .text-center
-            = link_to _("New issue"), new_project_issue_path(@project), class: "gl-button btn btn-confirm"
+            = link_button_to _("New issue"), new_project_issue_path(@project), variant: :confirm
       - elsif is_closed_state && opened_issues_count > 0 && closed_issues_count == 0
         %h4.text-center
           = _("There are no closed issues")
@@ -39,7 +39,7 @@
         - if button_path
           .text-center
             - if show_new_issue_link?(@project)
-              = link_to _('New issue'), button_path, class: 'gl-button btn btn-confirm', id: 'new_issue_link'
+              = link_button_to _('New issue'), button_path, id: 'new_issue_link', variant: :confirm
 
             - if show_import_button
               .js-csv-import-export-buttons{ data: { show_import_button: 'true', issuable_type: 'issue', import_csv_issues_path: import_csv_namespace_project_issues_path, can_edit: can_edit.to_s, project_import_jira_path: project_import_jira_path(@project), max_attachment_size: number_to_human_size(Gitlab::CurrentSettings.max_attachment_size.megabytes) } }
@@ -59,4 +59,4 @@
         %p
           = _("The Issue Tracker is the place to add things that need to be improved or solved in a project. You can register or sign in to create issues for this project.")
         .text-center
-          = link_to _('Register / Sign In'), new_user_session_path, class: 'gl-button btn btn-confirm'
+          = link_button_to _('Register / Sign In'), new_user_session_path, variant: :confirm
diff --git a/app/views/shared/empty_states/_labels.html.haml b/app/views/shared/empty_states/_labels.html.haml
index da88c139a6e0120ced25852c86debfbf3fb0a4ad..4d2127c016173b17bcf9d73054bc78c394a42cce 100644
--- a/app/views/shared/empty_states/_labels.html.haml
+++ b/app/views/shared/empty_states/_labels.html.haml
@@ -8,7 +8,7 @@
       %p= _("You can also star a label to make it a priority label.")
       .text-center
         - if can?(current_user, :admin_label, @project)
-          = link_to _('New label'), new_project_label_path(@project), class: 'btn gl-button btn-confirm', title: _('New label'), id: 'new_label_link'
-          = link_to _('Generate a default set of labels'), generate_project_labels_path(@project), method: :post, class: 'btn gl-button btn-confirm-secondary', title: _('Generate a default set of labels'), id: 'generate_labels_link'
+          = link_button_to _('New label'), new_project_label_path(@project), title: _('New label'), id: 'new_label_link', variant: :confirm
+          = link_button_to _('Generate a default set of labels'), generate_project_labels_path(@project), method: :post, title: _('Generate a default set of labels'), id: 'generate_labels_link', variant: :confirm, category: :secondary
         - if can?(current_user, :admin_label, @group)
-          = link_to _('New label'), new_group_label_path(@group), class: 'btn gl-button btn-confirm', title: _('New label'), id: 'new_label_link'
+          = link_button_to _('New label'), new_group_label_path(@group), title: _('New label'), id: 'new_label_link', variant: :confirm
diff --git a/app/views/shared/empty_states/_merge_requests.html.haml b/app/views/shared/empty_states/_merge_requests.html.haml
index 94589996c3a6d0fb034d0451f21a098d84b0c2e7..5b377818c6ea4b85598093958a44b69b4c3dbc4a 100644
--- a/app/views/shared/empty_states/_merge_requests.html.haml
+++ b/app/views/shared/empty_states/_merge_requests.html.haml
@@ -18,7 +18,7 @@
           = _("To widen your search, change or remove filters above")
         .text-center
           - if can_create_merge_request
-            = link_to _("New merge request"), button_path || project_new_merge_request_path(@project), class: "gl-button btn btn-confirm", title: _("New merge request")
+            = link_button_to _("New merge request"), button_path || project_new_merge_request_path(@project), title: _("New merge request"), variant: :confirm
       - elsif is_opened_state && opened_merged_count == 0 && closed_merged_count > 0
         %h4.text-center
           = _("There are no open merge requests")
@@ -26,7 +26,7 @@
           = _("To keep this project going, create a new merge request")
         .text-center
           - if can_create_merge_request
-            = link_to _("New merge request"), button_path || project_new_merge_request_path(@project), class: "gl-button btn btn-confirm", title: _("New merge request")
+            = link_button_to _("New merge request"), button_path || project_new_merge_request_path(@project), title: _("New merge request"), variant: :confirm
       - elsif is_closed_state && opened_merged_count > 0 && closed_merged_count == 0
         %h4.text-center
           = _("There are no closed merge requests")
@@ -37,4 +37,4 @@
           = _("Interested parties can even contribute by pushing commits if they want to.")
         - if button_path
           .text-center
-            = link_to _('New merge request'), button_path, class: 'gl-button btn btn-confirm', title: _('New merge request'), id: 'new_merge_request_link', data: { qa_selector: "new_merge_request_button" }
+            = link_button_to _('New merge request'), button_path, title: _('New merge request'), id: 'new_merge_request_link', data: { qa_selector: "new_merge_request_button" }, variant: :confirm
diff --git a/app/views/shared/empty_states/_profile_tabs.html.haml b/app/views/shared/empty_states/_profile_tabs.html.haml
index c813fd691f170919afe7e76b2e176ed371716b44..ba5fbd9052805dc23368cc68edb8dce38248f4d9 100644
--- a/app/views/shared/empty_states/_profile_tabs.html.haml
+++ b/app/views/shared/empty_states/_profile_tabs.html.haml
@@ -13,9 +13,9 @@
           %p= current_user_empty_message_description
 
         - if secondary_button_link.present?
-          = link_to secondary_button_label, secondary_button_link, class: 'gl-button btn btn-confirm btn-inverted'
+          = link_button_to secondary_button_label, secondary_button_link, variant: :confirm, category: :secondary
 
         - if primary_button_link.present?
-          = link_to primary_button_label, primary_button_link, class: 'gl-button btn btn-confirm'
+          = link_button_to primary_button_label, primary_button_link, variant: :confirm
       - else
         %h5= visitor_empty_message
diff --git a/app/views/shared/empty_states/_snippets.html.haml b/app/views/shared/empty_states/_snippets.html.haml
index 87de756093d75d3727cdc8ca10d2af1b2a002880..6fe36d75453210a1bb6301dea8957bde69215bfe 100644
--- a/app/views/shared/empty_states/_snippets.html.haml
+++ b/app/views/shared/empty_states/_snippets.html.haml
@@ -12,7 +12,7 @@
           = s_('SnippetsEmptyState|Store, share, and embed small pieces of code and text.')
         .gl-mt-3<
           - if button_path
-            = link_to s_('SnippetsEmptyState|New snippet'), button_path, class: 'btn gl-button btn-confirm', title: s_('SnippetsEmptyState|New snippet'), id: 'new_snippet_link', data: { qa_selector: 'create_first_snippet_link' }
-          = link_to s_('SnippetsEmptyState|Documentation'), help_page_path('user/snippets.md'), class: 'btn gl-button btn-default', title: s_('SnippetsEmptyState|Documentation')
+            = link_button_to s_('SnippetsEmptyState|New snippet'), button_path, title: s_('SnippetsEmptyState|New snippet'), id: 'new_snippet_link', data: { qa_selector: 'create_first_snippet_link' }, variant: :confirm
+          = link_button_to s_('SnippetsEmptyState|Documentation'), help_page_path('user/snippets.md'), title: s_('SnippetsEmptyState|Documentation')
       - else
         %h4.gl-text-center= s_('SnippetsEmptyState|There are no snippets to show.')
diff --git a/app/views/shared/empty_states/_wikis.html.haml b/app/views/shared/empty_states/_wikis.html.haml
index 57f1c9d381e7a7306680460cdc75d68a7c37c089..9e628a1f4099e38fbe1bd15b7f0965f22b832e79 100644
--- a/app/views/shared/empty_states/_wikis.html.haml
+++ b/app/views/shared/empty_states/_wikis.html.haml
@@ -4,7 +4,7 @@
 
 - if !hide_create && can?(current_user, :create_wiki, @wiki.container)
   - create_path = wiki_page_path(@wiki, params[:id], view: 'create')
-  - create_link = link_to s_('WikiEmpty|Create your first page'), create_path, class: 'btn gl-button btn-confirm', title: s_('WikiEmpty|Create your first page'), data: { qa_selector: 'create_first_page_link' }
+  - create_link = link_button_to s_('WikiEmpty|Create your first page'), create_path, title: s_('WikiEmpty|Create your first page'), data: { qa_selector: 'create_first_page_link' }, variant: :confirm
 
   = render layout: layout_path, locals: { image_path: 'illustrations/wiki_login_empty.svg' } do
     %h4.text-left
@@ -26,7 +26,7 @@
     %p.text-left
       = messages.dig(:issuable, :body).html_safe % { issues_link: issues_link }
     - if show_new_issue_link?(@project)
-      = link_to s_('WikiEmpty|Suggest wiki improvement'), new_project_issue_path(@project), class: 'btn gl-button btn-confirm', title: s_('WikiEmptyIssueMessage|Suggest wiki improvement')
+      = link_button_to s_('WikiEmpty|Suggest wiki improvement'), new_project_issue_path(@project), title: s_('WikiEmptyIssueMessage|Suggest wiki improvement'), variant: :confirm
 
 - else
   = render layout: layout_path, locals: { image_path: 'illustrations/wiki_logout_empty.svg' } do
diff --git a/app/views/shared/integrations/gitlab_slack_application/_slack_integration_form.html.haml b/app/views/shared/integrations/gitlab_slack_application/_slack_integration_form.html.haml
index 5c9f77f8c12ee384b452632257fe900e873013b1..e6e7ec28807a78dda9237e73910f9abc39ffd61b 100644
--- a/app/views/shared/integrations/gitlab_slack_application/_slack_integration_form.html.haml
+++ b/app/views/shared/integrations/gitlab_slack_application/_slack_integration_form.html.haml
@@ -22,7 +22,7 @@
       %td{ class: 'gl-py-3!' }
         .controls
           - project = integration.project
-          = link_to _('Edit'), edit_project_settings_slack_path(project), class: 'btn gl-button btn-default'
+          = link_button_to _('Edit'), edit_project_settings_slack_path(project)
           = link_to sprite_icon('remove', css_class: 'gl-icon'), project_settings_slack_path(project), method: :delete, class: 'btn gl-button btn-danger btn-danger-secondary', aria: { label: s_('SlackIntegration|Remove project') }, data: { confirm_btn_variant: "danger", confirm: s_('SlackIntegration|Are you sure you want to remove this project from the GitLab for Slack app?') }
   .gl-my-5
     = render 'shared/integrations/gitlab_slack_application/slack_button', project: @project, label: s_('SlackIntegration|Reinstall GitLab for Slack app')
diff --git a/app/views/shared/integrations/prometheus/_custom_metrics.html.haml b/app/views/shared/integrations/prometheus/_custom_metrics.html.haml
index 0264196f60ca3b85d121ef936b4d1c3e7bac368e..a7a650aa95dd33abd80e00335d5a2d423dc3189d 100644
--- a/app/views/shared/integrations/prometheus/_custom_metrics.html.haml
+++ b/app/views/shared/integrations/prometheus/_custom_metrics.html.haml
@@ -11,7 +11,7 @@
       %strong
         = s_('PrometheusService|Custom metrics')
       = gl_badge_tag 0, nil, class: 'gl-ml-2 js-custom-monitored-count'
-      = link_to s_('PrometheusService|New metric'), new_project_prometheus_metric_path(project), class: 'btn gl-button btn-confirm gl-ml-auto js-new-metric-button hidden'
+      = link_button_to s_('PrometheusService|New metric'), new_project_prometheus_metric_path(project), class: 'gl-ml-auto js-new-metric-button hidden', variant: :confirm
     - c.with_body do
       .flash-container.hidden
         .flash-warning
diff --git a/app/views/shared/integrations/slack_slash_commands/_help.html.haml b/app/views/shared/integrations/slack_slash_commands/_help.html.haml
index fee0ca15808db25b72b9dd72b04cfae0be11ef10..43a240fa6feec290c140ad7b7191815b8ba32112 100644
--- a/app/views/shared/integrations/slack_slash_commands/_help.html.haml
+++ b/app/views/shared/integrations/slack_slash_commands/_help.html.haml
@@ -57,7 +57,7 @@
           = label_tag nil, _('Customize icon'), class: 'col-12 col-form-label label-bold'
           .col-12
             = image_tag(asset_url('slash-command-logo.png', skip_pipeline: true), width: 36, height: 36, class: 'mr-3')
-            = link_to(_('Download image'), asset_url('gitlab_logo.png'), class: 'gl-button btn btn-default btn-sm', target: '_blank', rel: 'noopener noreferrer')
+            = link_button_to _('Download image'), asset_url('gitlab_logo.png'), target: '_blank', rel: 'noopener noreferrer', size: :small
 
         .form-group
           = label_tag nil, _('Autocomplete'), class: 'col-12 col-form-label label-bold'
diff --git a/app/views/shared/issuable/_form.html.haml b/app/views/shared/issuable/_form.html.haml
index b6bd691213c5d7bd9ab7bb3920f142baa2457b7f..42f035b99aa6ecf9a4274cdcb7f775783abf63d9 100644
--- a/app/views/shared/issuable/_form.html.haml
+++ b/app/views/shared/issuable/_form.html.haml
@@ -61,14 +61,14 @@
     = form.submit _('Save changes'), pajamas_button: true, class: 'gl-mr-2 js-issuable-submit-button js-reset-autosave', data: { track_action: 'click_button', track_label: 'submit_mr', track_value: 0 }
 
   - if issuable.new_record?
-    = link_to _('Cancel'), polymorphic_path([@project, issuable.class]), class: 'btn gl-button btn-default js-reset-autosave'
+    = link_button_to _('Cancel'), polymorphic_path([@project, issuable.class]), class: 'js-reset-autosave'
   - else
-    = link_to _('Cancel'), polymorphic_path([@project, issuable]), class: 'gl-button btn btn-default js-reset-autosave'
+    = link_button_to _('Cancel'), polymorphic_path([@project, issuable]), class: 'js-reset-autosave'
     - if can?(current_user, :"destroy_#{issuable.to_ability_name}", @project)
       - confirm_title = _('Delete %{issuableType}?') % { issuableType: issuable.human_class_name }
       - confirm_body = _('You’re about to permanently delete the %{issuableType} ‘%{strongOpen}%{issuableTitle}%{strongClose}’. To avoid data loss, consider %{strongOpen}closing this %{issuableType}%{strongClose} instead. Once deleted, it cannot be undone or recovered.') % { issuableType: issuable.human_class_name, issuableTitle: issuable.title, strongOpen: '<strong>', strongClose: '</strong>' }
       - confirm_primary_btn_text = _('Delete %{issuableType}') % { issuableType: issuable.human_class_name }
-      = link_to _('Delete'), polymorphic_path([@project, issuable], params: { destroy_confirm: true }), data: { title: confirm_title, confirm: confirm_body, is_html_message: true, confirm_btn_variant: 'danger'}, method: :delete, class: 'btn gl-button btn-danger btn-danger-secondary gl-float-right js-reset-autosave', "aria-label": confirm_primary_btn_text
+      = link_button_to _('Delete'), polymorphic_path([@project, issuable], params: { destroy_confirm: true }), data: { title: confirm_title, confirm: confirm_body, is_html_message: true, confirm_btn_variant: 'danger'}, method: :delete, class: 'gl-float-right js-reset-autosave', "aria-label": confirm_primary_btn_text, variant: :danger, category: :secondary
 
 - if issuable.respond_to?(:issue_type)
   = form.hidden_field :issue_type
diff --git a/app/views/shared/milestones/_milestone.html.haml b/app/views/shared/milestones/_milestone.html.haml
index 01548325c838633d456627a670a67126861f2057..c36d3a8b92b2549b39733859f901c8211280b87f 100644
--- a/app/views/shared/milestones/_milestone.html.haml
+++ b/app/views/shared/milestones/_milestone.html.haml
@@ -52,6 +52,6 @@
             = render Pajamas::ButtonComponent.new(icon: 'level-up', category: :tertiary, size: :small, button_options: { class: 'js-promote-project-milestone-button', title: s_('Milestones|Promote to Group Milestone'), disabled: true, data: { toggle: 'tooltip', container: 'body', url: promote_project_milestone_path(milestone.project, milestone), milestone_title: milestone.title, group_name: @project.group.name } })
         - if can?(current_user, :admin_milestone, milestone)
           - if milestone.closed?
-            = link_to s_('Milestones|Reopen Milestone'), milestone_path(milestone, milestone: { state_event: :activate }), method: :put, class: "btn gl-button btn-sm gl-ml-3"
+            = link_button_to s_('Milestones|Reopen Milestone'), milestone_path(milestone, milestone: { state_event: :activate }), method: :put, class: 'gl-ml-3', size: :small
           - else
-            = link_to s_('Milestones|Close Milestone'), milestone_path(milestone, milestone: { state_event: :close }), method: :put, class: "btn gl-button btn-default btn-default-secondary btn-sm gl-ml-3"
+            = link_button_to s_('Milestones|Close Milestone'), milestone_path(milestone, milestone: { state_event: :close }), method: :put, class: 'gl-ml-3', category: :secondary, size: :small
diff --git a/app/views/shared/web_hooks/_web_hook_disabled_alert.html.haml b/app/views/shared/web_hooks/_web_hook_disabled_alert.html.haml
index cbbb2f51fd5ded6d5259eb3b91bc866ad6ef22e3..1580fc0bd6dbc0a6fa934d9e07bbcab38b0df755 100644
--- a/app/views/shared/web_hooks/_web_hook_disabled_alert.html.haml
+++ b/app/views/shared/web_hooks/_web_hook_disabled_alert.html.haml
@@ -10,4 +10,4 @@
       = succeed '.' do
         = link_to _('Learn more'), help_page_path('user/project/integrations/webhooks', anchor: 'troubleshooting'), target: '_blank', rel: 'noopener noreferrer'
     - c.with_actions do
-      = link_to s_('Webhooks|Go to webhooks'), project_hooks_path(@project, anchor: 'webhooks-index'), class: 'btn gl-alert-action btn-confirm gl-button'
+      = link_button_to s_('Webhooks|Go to webhooks'), project_hooks_path(@project, anchor: 'webhooks-index'), class: 'gl-alert-action', variant: :confirm
diff --git a/ee/app/components/namespaces/storage/limit_alert_component.html.haml b/ee/app/components/namespaces/storage/limit_alert_component.html.haml
index a9f0d3315552ac48e6c92e85861e1c56968fd111..1a2eb5f57e0290076e37ee1a237545baec35bb8a 100644
--- a/ee/app/components/namespaces/storage/limit_alert_component.html.haml
+++ b/ee/app/components/namespaces/storage/limit_alert_component.html.haml
@@ -17,6 +17,6 @@
     - if purchase_link || usage_quotas_link
       = c.with_actions do
         - if purchase_link
-          = link_to(_('Purchase more storage'), purchase_link, class: "btn gl-alert-action btn-md gl-button btn-confirm")
+          = link_button_to _('Purchase more storage'), purchase_link, class: 'gl-alert-action', variant: :confirm
         - if usage_quotas_link
-          = link_to(_('View usage details'), usage_quotas_link, class: "btn gl-alert-action btn-md gl-button btn-default")
+          = link_button_to _('View usage details'), usage_quotas_link, class: 'gl-alert-action'
diff --git a/ee/app/components/namespaces/storage/limit_alert_component.rb b/ee/app/components/namespaces/storage/limit_alert_component.rb
index b479f637ff630f875eabeebc11e1d178e214e33b..fb98ce1b9351ae8c80fcda785eae0d029af0086e 100644
--- a/ee/app/components/namespaces/storage/limit_alert_component.rb
+++ b/ee/app/components/namespaces/storage/limit_alert_component.rb
@@ -14,7 +14,9 @@ def initialize(context:, user:)
 
       private
 
-      delegate :sprite_icon, :usage_quotas_path, :buy_storage_path, :purchase_storage_url, :promo_url, to: :helpers
+      delegate :sprite_icon, :usage_quotas_path, :buy_storage_path,
+        :purchase_storage_url, :promo_url, :link_button_to,
+        to: :helpers
       attr_reader :context, :root_namespace, :user, :root_storage_size
 
       def render?
diff --git a/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml b/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml
index 04e90dada1aefd9b08607b9191cd9fcdc39cd55c..50dbd52fa40ea99f0e9eb7fd388814ec4c641bbc 100644
--- a/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml
+++ b/ee/app/views/admin/application_settings/_elasticsearch_form.html.haml
@@ -31,7 +31,7 @@
                   = link_to _('Learn more.'), help_page_path('integration/advanced_search/elasticsearch', anchor: 'advanced-search-migrations')
                 - c.with_actions do
                   - migration = Elastic::DataMigrationService.halted_migration
-                  = link_to _('Retry migration'), admin_elasticsearch_retry_migration_path(version: migration.version), class: 'btn gl-alert-action btn-confirm gl-button', disabled: @last_elasticsearch_reindexing_task&.in_progress?, data: { confirm: _('Are you sure you want to retry this migration?') }, method: :post
+                  = link_button_to _('Retry migration'), admin_elasticsearch_retry_migration_path(version: migration.version), class: 'gl-alert-action', disabled: @last_elasticsearch_reindexing_task&.in_progress?, data: { confirm: _('Are you sure you want to retry this migration?') }, method: :post, variant: :confirm
 
             .form-group
               - unless Gitlab::CurrentSettings.elasticsearch_indexing?
diff --git a/ee/app/views/admin/licenses/_summary.html.haml b/ee/app/views/admin/licenses/_summary.html.haml
index 9a3711e6bfa511b4ceda94cce74cf21c8c4822d7..0e9fa892b1c425dfc146c3e8b38d0a759be8bfbc 100644
--- a/ee/app/views/admin/licenses/_summary.html.haml
+++ b/ee/app/views/admin/licenses/_summary.html.haml
@@ -15,4 +15,4 @@
           %strong= @license.licensee_name
           = "(#{@license.licensee_email})"
     %div
-      = link_to _('View details'), admin_subscription_path, class: "gl-button btn btn-default"
+      = link_button_to _('View details'), admin_subscription_path
diff --git a/ee/app/views/groups/hook_logs/show.html.haml b/ee/app/views/groups/hook_logs/show.html.haml
index a3e35d668a94184b4640dfb6bf454465f69eb4b3..4ae550aa8f7d1e2765fed0a0ee4fa59b96b2ea22 100644
--- a/ee/app/views/groups/hook_logs/show.html.haml
+++ b/ee/app/views/groups/hook_logs/show.html.haml
@@ -9,6 +9,6 @@
 - if @hook_log.oversize?
   = button_tag _("Resend Request"), class: "btn gl-button btn-default float-right gl-ml-3 has-tooltip", disabled: true, title: _("Request data is too large")
 - else
-  = link_to _("Resend Request"), @hook_log.present.retry_path, method: :post, class: "btn gl-button btn-default float-right gl-ml-3"
+  = link_button_to _("Resend Request"), @hook_log.present.retry_path, method: :post, class: 'float-right gl-ml-3'
 
 = render partial: 'shared/hook_logs/content', locals: { hook_log: @hook_log }
diff --git a/ee/app/views/groups/hooks/edit.html.haml b/ee/app/views/groups/hooks/edit.html.haml
index 2694f501b925065a6ce0b511b4cf497a77ed040a..a0fd6ff25db9d4b686c516d2bcc683eb15f5e81f 100644
--- a/ee/app/views/groups/hooks/edit.html.haml
+++ b/ee/app/views/groups/hooks/edit.html.haml
@@ -12,7 +12,7 @@
     %div
       = f.submit _('Save changes'), pajamas_button: true, class: 'gl-sm-mr-3'
       = render 'shared/web_hooks/test_button', hook: @hook
-      = link_to _('Delete'), group_hook_path(@group, @hook), method: :delete, class: 'gl-button btn btn-danger gl-float-right', aria: { label: s_('Webhooks|Delete webhook') }, data: { confirm: s_('Webhooks|Are you sure you want to delete this group hook?'), confirm_btn_variant: 'danger' }
+      = link_button_to _('Delete'), group_hook_path(@group, @hook), method: :delete, class: 'gl-float-right', aria: { label: s_('Webhooks|Delete webhook') }, data: { confirm: s_('Webhooks|Are you sure you want to delete this group hook?'), confirm_btn_variant: 'danger' }, variant: :danger
 
 %hr
 
diff --git a/ee/app/views/groups/saml_group_links/_saml_group_link.html.haml b/ee/app/views/groups/saml_group_links/_saml_group_link.html.haml
index fc7a668de2cfd17bcef107ff8fdda0ea04e54d67..c94e68ccae8baa6d5df3b86fead61aa2ebcf68bf 100644
--- a/ee/app/views/groups/saml_group_links/_saml_group_link.html.haml
+++ b/ee/app/views/groups/saml_group_links/_saml_group_link.html.haml
@@ -1,9 +1,8 @@
 %li
   .float-right
-    = link_to group_saml_group_link_path(group, saml_group_link), method: :delete, class: 'btn gl-button btn-danger btn-md', 'aria-label': _('Remove link'),
-      data: { confirm: s_('GroupSAML|Are you sure you want to remove the SAML group link?'), 'confirm-btn-variant': 'danger' } do
-      = sprite_icon('unlink', size: 12, css_class: 'gl-m-1!')
-      %span= _('Remove')
+    = link_button_to group_saml_group_link_path(group, saml_group_link), method: :delete, 'aria-label': _('Remove link'),
+      data: { confirm: s_('GroupSAML|Are you sure you want to remove the SAML group link?'), 'confirm-btn-variant': 'danger' }, variant: :danger, icon: 'unlink' do
+      = _('Remove')
   %strong= s_('GroupSAML|SAML Group Name: %{saml_group_name}') % { saml_group_name: saml_group_link.saml_group_name }
 
   .light
diff --git a/ee/app/views/groups/settings/domain_verification/_lets_encrypt_callout.html.haml b/ee/app/views/groups/settings/domain_verification/_lets_encrypt_callout.html.haml
index 8c7e220e037da3cb80a2bebb4eedabfcb1246b02..b6f368d9d055f2f646bdd5ada2e64c152faf2577 100644
--- a/ee/app/views/groups/settings/domain_verification/_lets_encrypt_callout.html.haml
+++ b/ee/app/views/groups/settings/domain_verification/_lets_encrypt_callout.html.haml
@@ -7,7 +7,7 @@
             = sprite_icon('warning-solid', css_class: 'gl-mr-2 gl-text-orange-600')
             = _("Something went wrong while obtaining the Let's Encrypt certificate.")
           .row.gl-mx-0.gl-mt-3
-            = link_to _('Retry'), retry_auto_ssl_group_settings_domain_verification_path(group, domain_presenter), class: "gl-button btn btn-default btn-sm btn-grouped", method: :post
+            = link_button_to _('Retry'), retry_auto_ssl_group_settings_domain_verification_path(group, domain_presenter), class: 'btn-grouped', method: :post, size: :small
     - elsif !domain_presenter.certificate_gitlab_provided?
       .form-group.gl-form-group.js-shown-if-auto-ssl{ class: ("gl-display-none" unless auto_ssl_available_and_enabled) }
         .bs-callout.bs-callout-info.gl-mt-0
diff --git a/ee/app/views/groups/settings/domain_verification/new.html.haml b/ee/app/views/groups/settings/domain_verification/new.html.haml
index 732b39350c2ace48b76614e461b9995f80b03e2e..965a6d7b14c46a43a82f3f350aa1965a9866ff5e 100644
--- a/ee/app/views/groups/settings/domain_verification/new.html.haml
+++ b/ee/app/views/groups/settings/domain_verification/new.html.haml
@@ -8,4 +8,4 @@
   = gitlab_ui_form_for domain_presenter, url: group_settings_domain_verification_index_path(@group), html: { name: "domainForm", class: 'fieldset-form' } do |f|
     = render 'form', { f: f }
     = f.submit s_("DomainVerification|Add Domain"), class: 'gl-mr-3', pajamas_button: true
-    = link_to _('Cancel'), group_settings_domain_verification_index_path(@group), class: 'gl-button btn btn-default btn-cancel'
+    = link_button_to _('Cancel'), group_settings_domain_verification_index_path(@group)
diff --git a/ee/app/views/groups/settings/domain_verification/show.html.haml b/ee/app/views/groups/settings/domain_verification/show.html.haml
index 3e4cdd136a3753a7054958f6c077d8c606abbc96..16fc788a7289193c72a9b27234f461a15f14c26d 100644
--- a/ee/app/views/groups/settings/domain_verification/show.html.haml
+++ b/ee/app/views/groups/settings/domain_verification/show.html.haml
@@ -8,4 +8,4 @@
   = gitlab_ui_form_for domain_presenter, url: group_settings_domain_verification_path(@group, domain_presenter), html: { name: "domain-form", class: 'fieldset-form' } do |f|
     = render 'form', { f: f }
     = f.submit _('Save Changes'), class: 'gl-mr-3', pajamas_button: true
-    = link_to _('Cancel'), group_settings_domain_verification_index_path(@group), class: 'gl-button btn btn-default btn-cancel'
+    = link_button_to _('Cancel'), group_settings_domain_verification_index_path(@group)
diff --git a/ee/app/views/layouts/header/_licensed_user_count_threshold.html.haml b/ee/app/views/layouts/header/_licensed_user_count_threshold.html.haml
index 1d793a0964bc9f90b2ae12a5bfaddb240c3d2b13..7c165eb532b98f6f4f84394b97f1ff38512d23d1 100644
--- a/ee/app/views/layouts/header/_licensed_user_count_threshold.html.haml
+++ b/ee/app/views/layouts/header/_licensed_user_count_threshold.html.haml
@@ -6,5 +6,5 @@
     - c.with_body do
       = _('Your instance has %{remaining_user_count} users remaining of the %{total_user_count} included in your subscription. You can add more users than the number included in your license, and we will include the overage in your next bill.') % { remaining_user_count: remaining_user_count, total_user_count: total_user_count }
     - c.with_actions do
-      = link_to _('View users statistics'), admin_users_path, class: 'btn gl-alert-action btn-confirm btn-md gl-button'
-      = link_to _('Contact support'), EE::CUSTOMER_LICENSE_SUPPORT_URL, rel: 'nofollow', class: 'btn gl-alert-action btn-confirm btn-md gl-button btn-confirm-secondary'
+      = link_button_to _('View users statistics'), admin_users_path, class: 'gl-alert-action', variant: :confirm
+      = link_button_to _('Contact support'), EE::CUSTOMER_LICENSE_SUPPORT_URL, rel: 'nofollow', class: 'gl-alert-action', variant: :confirm, category: :secondary
diff --git a/ee/app/views/layouts/header/_read_only_banner.html.haml b/ee/app/views/layouts/header/_read_only_banner.html.haml
index 0c48c1b26d89b02c760ba5b18c12b20a0aef54a0..9ed358d2fcfda83444124d490fe29ad76fee5c35 100644
--- a/ee/app/views/layouts/header/_read_only_banner.html.haml
+++ b/ee/app/views/layouts/header/_read_only_banner.html.haml
@@ -17,4 +17,4 @@
       = secondary_description
     - c.with_actions do
       - if ::Gitlab::Geo.primary_node.present?
-        = link_to s_('Geo|Go to the primary site'), ::Gitlab::Geo.primary_node_url, class: "btn gl-alert-action btn-default btn-md gl-button btn-default-secondary"
+        = link_button_to s_('Geo|Go to the primary site'), ::Gitlab::Geo.primary_node_url, class: 'gl-alert-action', category: :secondary
diff --git a/ee/app/views/layouts/header/_seat_count_alert.html.haml b/ee/app/views/layouts/header/_seat_count_alert.html.haml
index 6a466bcfb3d87c7d61a7b66a5dcabc91dd15d345..5b45a0b3f6a0b023146d63a742736b874aabcae0 100644
--- a/ee/app/views/layouts/header/_seat_count_alert.html.haml
+++ b/ee/app/views/layouts/header/_seat_count_alert.html.haml
@@ -12,4 +12,4 @@
       = _('Even if you reach the number of seats in your subscription, you can continue to add users, and GitLab will bill you for the overage.')
       = link_to _('Learn more.'), help_page_path('subscriptions/quarterly_reconciliation'), target: '_blank', rel: 'noopener noreferrer'
     - c.with_actions do
-      = link_to _('View seat usage'), usage_quotas_path(namespace, anchor: 'seats-quota-tab'), class: 'btn gl-alert-action btn-confirm btn-md gl-button'
+      = link_button_to _('View seat usage'), usage_quotas_path(namespace, anchor: 'seats-quota-tab'), class: 'gl-alert-action', variant: :confirm
diff --git a/ee/app/views/shared/_manual_quarterly_reconciliation_banner.html.haml b/ee/app/views/shared/_manual_quarterly_reconciliation_banner.html.haml
index 66ae110585da21ce4b50ee9bc0622b68ff036839..23352eebe608e207412657a41100a3c023827820 100644
--- a/ee/app/views/shared/_manual_quarterly_reconciliation_banner.html.haml
+++ b/ee/app/views/shared/_manual_quarterly_reconciliation_banner.html.haml
@@ -11,5 +11,5 @@
       - c.with_body do
         = payload.body
       - c.with_actions do
-        = link_to s_('SubscriptionBanner|Export license usage file'), admin_license_usage_export_path(format: :csv), class: 'btn gl-alert-action gl-button btn-confirm'
-        = link_to s_('SubscriptionBanner|Add new license'), general_admin_application_settings_path, class: 'btn gl-alert-action gl-button btn-default'
+        = link_button_to s_('SubscriptionBanner|Export license usage file'), admin_license_usage_export_path(format: :csv), class: 'gl-alert-action', variant: :confirm
+        = link_button_to s_('SubscriptionBanner|Add new license'), general_admin_application_settings_path, class: 'gl-alert-action'
diff --git a/ee/app/views/shared/_namespace_user_cap_reached_alert.html.haml b/ee/app/views/shared/_namespace_user_cap_reached_alert.html.haml
index a4067bb2b5ad838a3cf7c8d949aa15b6718920ed..70bc6d63963853e9c8884ab0fcbbe1cfff3ea9e8 100644
--- a/ee/app/views/shared/_namespace_user_cap_reached_alert.html.haml
+++ b/ee/app/views/shared/_namespace_user_cap_reached_alert.html.haml
@@ -18,4 +18,4 @@
   - c.with_body do
     = s_('NamespaceUserCap|Pending users must be reviewed and approved by a group owner. Learn more about %{user_caps_link_start}user caps%{link_end} and %{users_pending_approval_link_start}users pending approval%{link_end}.').html_safe % { user_caps_link_start: user_caps_link_start, users_pending_approval_link_start: users_pending_approval_link_start, link_end: link_end }
   - c.with_actions do
-    = link_to(s_('NamespaceUserCap|View pending approvals'), pending_users_link, class: "btn gl-alert-action btn-md gl-button btn-confirm")
+    = link_button_to s_('NamespaceUserCap|View pending approvals'), pending_users_link, class: 'gl-alert-action', variant: :confirm
diff --git a/ee/app/views/shared/_new_user_signups_cap_reached_alert.html.haml b/ee/app/views/shared/_new_user_signups_cap_reached_alert.html.haml
index 10adf6d60cc5f757b65c90a092428f7669494b38..f85b1147f3e9df764ee2e7373b25bef72c2f3c8f 100644
--- a/ee/app/views/shared/_new_user_signups_cap_reached_alert.html.haml
+++ b/ee/app/views/shared/_new_user_signups_cap_reached_alert.html.haml
@@ -15,4 +15,4 @@
       = s_('Admin|Additional users must be reviewed and approved by a system administrator. Learn more about %{help_link_start}usage caps%{help_link_end}.').html_safe % { help_link_start: help_link_start, help_link_end: help_link_end }
     - if User.blocked_pending_approval.count > 0
       - c.with_actions do
-        = link_to s_('Admin|View pending user approvals'), admin_users_path({ filter: 'blocked_pending_approval' }), class: 'btn gl-alert-action btn-confirm gl-button'
+        = link_button_to s_('Admin|View pending user approvals'), admin_users_path({ filter: 'blocked_pending_approval' }), class: 'gl-alert-action', variant: :confirm
diff --git a/ee/app/views/shared/_submit_license_usage_data_banner.html.haml b/ee/app/views/shared/_submit_license_usage_data_banner.html.haml
index 1a1bc079f7210311ceefc60a9752f9c76a7c6308..e55849a235ef1e7c6f6f09dfe45123725524c907 100644
--- a/ee/app/views/shared/_submit_license_usage_data_banner.html.haml
+++ b/ee/app/views/shared/_submit_license_usage_data_banner.html.haml
@@ -12,5 +12,5 @@
       - c.with_body do
         = payload.body
       - c.with_actions do
-        = link_to s_('SubscriptionBanner|Export license usage file'), admin_license_usage_export_path(format: :csv), class: 'btn gl-alert-action gl-button btn-confirm'
-        = link_to s_('SubscriptionBanner|Upload new license'), general_admin_application_settings_path, class: 'btn gl-alert-action gl-button btn-default'
+        = link_button_to s_('SubscriptionBanner|Export license usage file'), admin_license_usage_export_path(format: :csv), class: 'gl-alert-action', variant: :confirm
+        = link_button_to s_('SubscriptionBanner|Upload new license'), general_admin_application_settings_path, class: 'gl-alert-action'
diff --git a/ee/app/views/shared/_ultimate_trial_callout_content.html.haml b/ee/app/views/shared/_ultimate_trial_callout_content.html.haml
index 6c0e2328997d1e722c3868d6b1fc125ea0550d7a..5ec994576fceafe4a2d1bcb691f2022cf0abeca1 100644
--- a/ee/app/views/shared/_ultimate_trial_callout_content.html.haml
+++ b/ee/app/views/shared/_ultimate_trial_callout_content.html.haml
@@ -15,7 +15,7 @@
           %p
             %span= _('Try all GitLab has to offer for 30 days.')
             %span.d-none.d-sm-inline= _('No credit card required.')
-          = link_to _('Start your free trial'), new_trial_path(glm_source: glm_source, glm_content: 'gold-callout'), class: "btn btn-confirm gl-button mt-2 mt-sm-0 #{button_css_class}", target: '_blank', rel: 'noopener noreferrer', data: { track_action: 'click_button', track_label: 'start_your_trial', track_property: banner_title }
+          = link_button_to _('Start your free trial'), new_trial_path(glm_source: glm_source, glm_content: 'gold-callout'), class: "mt-2 mt-sm-0 #{button_css_class}", target: '_blank', rel: 'noopener noreferrer', data: { track_action: 'click_button', track_label: 'start_your_trial', track_property: banner_title }, variant: :confirm
         - if is_dismissable
           = render Pajamas::ButtonComponent.new(category: :tertiary,
             icon: 'close',
diff --git a/ee/app/views/shared/credentials_inventory/resource_access_tokens/_resource_access_token.html.haml b/ee/app/views/shared/credentials_inventory/resource_access_tokens/_resource_access_token.html.haml
index 52ade78d0bc352fb624bac886d0ed9b661afcbb5..e63cccecc78877f20bb8dfb4702faf6b70df5c55 100644
--- a/ee/app/views/shared/credentials_inventory/resource_access_tokens/_resource_access_token.html.haml
+++ b/ee/app/views/shared/credentials_inventory/resource_access_tokens/_resource_access_token.html.haml
@@ -44,6 +44,6 @@
     .table-mobile-header{ role: 'rowheader' }
     .table-mobile-content
       - if project
-        = link_to _('Revoke'), admin_credential_resource_revoke_path(credential_id: resource_access_token, resource_id: project.id, resource_type: 'Project'), method: :put, data: { confirm: _('Are you sure you want to revoke this project access token? This action cannot be undone.') }, class: 'btn btn-danger btn-danger-secondary btn-md btn-secondary gl-button'
+        = link_button_to _('Revoke'), admin_credential_resource_revoke_path(credential_id: resource_access_token, resource_id: project.id, resource_type: 'Project'), method: :put, data: { confirm: _('Are you sure you want to revoke this project access token? This action cannot be undone.') }, variant: :danger, category: :secondary
       - else
-        = link_to _('Revoke'), admin_credential_resource_revoke_path(credential_id: resource_access_token, resource_id: group.id, resource_type: 'Group'), method: :put, data: { confirm: _('Are you sure you want to revoke this group access token? This action cannot be undone.') }, class: 'btn btn-danger btn-danger-secondary btn-md btn-secondary gl-button'
+        = link_button_to _('Revoke'), admin_credential_resource_revoke_path(credential_id: resource_access_token, resource_id: group.id, resource_type: 'Group'), method: :put, data: { confirm: _('Are you sure you want to revoke this group access token? This action cannot be undone.') }, variant: :danger, category: :secondary
diff --git a/ee/app/views/shared/promotions/_promote_epics.html.haml b/ee/app/views/shared/promotions/_promote_epics.html.haml
index da3550e9f2fc149e653b8458d70047f9cf88253d..78262e5f2cfa9d629e7d3a3b8a2cb5ccfd8dc67d 100644
--- a/ee/app/views/shared/promotions/_promote_epics.html.haml
+++ b/ee/app/views/shared/promotions/_promote_epics.html.haml
@@ -23,7 +23,7 @@
             = link_to _('Read more'), help_page_url('user/group/epics/index'), class: 'btn-link', target: '_blank', rel: 'noopener noreferrer'
           .gl-flex-wrap
             = render 'shared/promotions/promotion_link_project', short_form: true, location: :epics
-            = link_to s_("Promotions|Don't show me this again"), '#', class: 'gl-button btn js-close js-close-callout gl-mt-2'
+            = link_button_to s_("Promotions|Don't show me this again"), '#', class: 'js-close js-close-callout gl-mt-2'
 
     .hide-collapsed
       = s_('Promotions|This feature is locked.')
diff --git a/ee/app/views/shared/promotions/_promote_issue_weights.html.haml b/ee/app/views/shared/promotions/_promote_issue_weights.html.haml
index 5d74c2dcc93e3adfcf87206ebca8cf8c851bd923..de728228ad4c9e8dd0b0921534eed5f8c3074e5a 100644
--- a/ee/app/views/shared/promotions/_promote_issue_weights.html.haml
+++ b/ee/app/views/shared/promotions/_promote_issue_weights.html.haml
@@ -32,4 +32,4 @@
               = s_('Promotions|Improve issues management with Issue weight and GitLab Enterprise Edition.')
           %div
             = render 'shared/promotions/promotion_link_project', short_form: true, target_blank: false, location: :issue_weights
-            = link_to s_("Promotions|Not now, thanks!"), '#', class: ['gl-button', 'btn', 'js-close', 'js-close-callout', 'gl-mt-3', 'js-close-session', 'tr-issue-weights-not-now-cta']
+            = link_button_to s_("Promotions|Not now, thanks!"), '#', class: 'js-close js-close-callout gl-mt-3 js-close-session tr-issue-weights-not-now-cta'
diff --git a/ee/app/views/shared/promotions/_promote_mobile_devops.html.haml b/ee/app/views/shared/promotions/_promote_mobile_devops.html.haml
index 86802ed4bb34a14273b1b121f85e80224d187b4e..2d5eec05591ed998c2e8b481a282fc9a078dcc38 100644
--- a/ee/app/views/shared/promotions/_promote_mobile_devops.html.haml
+++ b/ee/app/views/shared/promotions/_promote_mobile_devops.html.haml
@@ -9,4 +9,4 @@
     %p
       = s_('Promotions|Use GitLab Mobile DevOps to quickly build, sign, and release native and cross-platform mobile apps for Android and iOS using GitLab CI/CD.')
     - c.with_primary_action do
-      = link_to s_('Promotions|Get started with GitLab Mobile DevOps'), help_page_path('ci/mobile_devops.md'), class: 'gl-button btn btn-confirm gl-mb-3'
+      = link_button_to s_('Promotions|Get started with GitLab Mobile DevOps'), help_page_path('ci/mobile_devops.md'), class: 'gl-mb-3', variant: :confirm
diff --git a/ee/app/views/shared/promotions/_promotion_link_project.html.haml b/ee/app/views/shared/promotions/_promotion_link_project.html.haml
index 3846af917b496a1bc9c5c21f32c654aee42285e9..fefaf84f1c616dc0f048cc2958b5991e03892264 100644
--- a/ee/app/views/shared/promotions/_promotion_link_project.html.haml
+++ b/ee/app/views/shared/promotions/_promotion_link_project.html.haml
@@ -5,7 +5,7 @@
   -# EE:SaaS
   - namespace = @project&.namespace || @group
   - if can?(current_user, :admin_namespace, namespace)
-    = link_to s_('Promotions|Try it for free'), new_trial_registration_path(glm_source: glm_source, glm_content: location), class: 'btn gl-button btn-confirm promotion-trial-cta', target: target_blank ? '_blank' : '_self'
+    = link_button_to s_('Promotions|Try it for free'), new_trial_registration_path(glm_source: glm_source, glm_content: location), class: 'promotion-trial-cta', target: target_blank ?'_blank' : '_self', variant: :confirm
   - elsif namespace.is_a?(Group)
     %p= s_('Promotions|Contact an owner of group %{namespace_name} to upgrade the plan.') % { namespace_name: namespace.name }
   - else
@@ -15,8 +15,8 @@
 - elsif current_user&.admin?
   -# EE:Self Managed
   - if License.current&.expired?
-    = link_to (!short_form ? s_('Promotions|Buy GitLab Enterprise Edition') : s_('Promotions|Buy EE')), Gitlab::Saas.about_pricing_url, class: 'btn gl-button btn-confirm'
+    = link_button_to (!short_form ? s_('Promotions|Buy GitLab Enterprise Edition') : s_('Promotions|Buy EE')), Gitlab::Saas.about_pricing_url, variant: :confirm
   - else
-    = link_to s_('Promotions|Start GitLab Ultimate trial'), new_trial_url, class: 'gl-button btn btn-confirm gl-mb-3'
+    = link_button_to s_('Promotions|Start GitLab Ultimate trial'), new_trial_url, class: 'gl-mb-3', variant: :confirm
 - else
   %p= s_('Promotions|Contact your Administrator to upgrade your license.')
diff --git a/ee/app/views/shared/web_hooks/_group_web_hook_disabled_alert.html.haml b/ee/app/views/shared/web_hooks/_group_web_hook_disabled_alert.html.haml
index 1113e0f337ddc57609dffc5b6d2165b32cc2beb8..258acf745a80bd9bce4d570da41c0b12dfc0f244 100644
--- a/ee/app/views/shared/web_hooks/_group_web_hook_disabled_alert.html.haml
+++ b/ee/app/views/shared/web_hooks/_group_web_hook_disabled_alert.html.haml
@@ -10,4 +10,4 @@
       = succeed '.' do
         = link_to _('Learn more'), help_page_path('user/project/integrations/webhooks', anchor: 'troubleshooting'), target: '_blank', rel: 'noopener noreferrer'
     - c.with_actions do
-      = link_to s_('Webhooks|Go to webhooks'), group_hooks_path(@group, anchor: 'webhooks-index'), class: 'btn gl-alert-action btn-confirm gl-button'
+      = link_button_to s_('Webhooks|Go to webhooks'), group_hooks_path(@group, anchor: 'webhooks-index'), class: 'gl-alert-action', variant: :confirm