diff --git a/blocks/tests/behat/behat_blocks.php b/blocks/tests/behat/behat_blocks.php
index 067c3c19853..98d92bd064c 100644
--- a/blocks/tests/behat/behat_blocks.php
+++ b/blocks/tests/behat/behat_blocks.php
@@ -48,7 +48,10 @@ class behat_blocks extends behat_base {
      */
     public function i_add_the_block($blockname) {
         $addblock = get_string('addblock');
-        $this->execute('behat_general::i_click_on_in_the', [$addblock, 'link_exact', '.add_block_button', 'css_element']);
+        $this->execute(
+            'behat_general::i_click_on_in_the',
+            [$addblock, 'link_exact', '[data-region="add-block-button"]', 'css_element']
+        );
 
         if (!$this->running_javascript()) {
             $this->execute('behat_general::i_click_on_in_the', [$blockname, 'link_exact', '#region-main', 'css_element']);
diff --git a/course/format/templates/local/content/addsection.mustache b/course/format/templates/local/content/addsection.mustache
index eed967b0403..ac9e55a9a0d 100644
--- a/course/format/templates/local/content/addsection.mustache
+++ b/course/format/templates/local/content/addsection.mustache
@@ -52,7 +52,7 @@
     {{/decrease}}
     {{#addsections}}
         <a href="{{{url}}}"
-           class="w-100 btn add-section justify-content-center align-items-center p-3"
+           class="w-100 btn btn-add-content rounded-4 p-3"
            data-add-sections="{{title}}"
            data-new-sections="{{newsection}}"
            data-action="addSection"
diff --git a/lib/templates/add_block_button.mustache b/lib/templates/add_block_button.mustache
index f5a5ffd5005..014030fe893 100644
--- a/lib/templates/add_block_button.mustache
+++ b/lib/templates/add_block_button.mustache
@@ -28,10 +28,10 @@
     }
 
 }}
-<div class="add_block_button">
-    <a href="{{link}}" id="addblock-{{uniqid}}" class="btn btn-link block-add text-start mb-3" data-key="addblock"
+<div class="d-grid" data-region="add-block-button">
+    <a href="{{link}}" id="addblock-{{uniqid}}" class="btn btn-add-content mb-3" data-key="addblock"
             data-url="{{escapedlink}}" data-blockregion="{{blockregion}}">
-        <i class="fa fa-plus py-2 me-3" aria-hidden="true"></i>{{#str}}addblock{{/str}}
+        <i class="fa fa-plus py-2 me-2" aria-hidden="true"></i>{{#str}}addblock{{/str}}
     </a>
 </div>
 
diff --git a/theme/boost/scss/moodle/buttons.scss b/theme/boost/scss/moodle/buttons.scss
index 8ad24a6ea1f..39aacb9a5e3 100644
--- a/theme/boost/scss/moodle/buttons.scss
+++ b/theme/boost/scss/moodle/buttons.scss
@@ -143,3 +143,23 @@ p.arrow_button {
     --#{$prefix}btn-focus-shadow-rgb: #{to-rgb($gray-600)};
     @include button-focus($gray-600, $white);
 }
+
+/*
+ * Add content buttons.
+ */
+
+.btn-add-content {
+    @include border-radius();
+    border: map-get($border-widths, 2) dashed $border-color;
+    color: $primary;
+    background-color: $body-bg;
+    font-size: $font-size-sm;
+    font-weight: bold;
+    &:hover,
+    &:focus {
+        background-color: $primary-light-background;
+        border-style: solid;
+        border-color: $primary;
+        color: $primary;
+    }
+}
diff --git a/theme/boost/scss/moodle/course.scss b/theme/boost/scss/moodle/course.scss
index 2a14dab1fd3..1081ad21d4c 100644
--- a/theme/boost/scss/moodle/course.scss
+++ b/theme/boost/scss/moodle/course.scss
@@ -53,21 +53,6 @@ $divider-hover-color: $primary !default;
     }
 }
 
-// Course 'add section' button.
-.btn.add-section {
-    @include border-radius($activity-border-radius);
-    border: $divider-width dashed $border-color;
-    color: $primary;
-    font-size: $font-size-sm;
-    font-weight: bold;
-    &:hover,
-    &:focus {
-        background-color: $primary-light-background;
-        border: $divider-width solid $primary;
-        color: $primary;
-    }
-}
-
 // Max sections reached alert.
 .max-section-alert {
     border-top: $divider-width dashed $border-color;
diff --git a/theme/boost/style/moodle.css b/theme/boost/style/moodle.css
index 23830b24f94..9ed946b3af8 100644
--- a/theme/boost/style/moodle.css
+++ b/theme/boost/style/moodle.css
@@ -30629,19 +30629,6 @@ table.calendartable caption {
   display: block;
 }
 
-.btn.add-section {
-  border-radius: 1rem;
-  border: 2px dashed #dee2e6;
-  color: #0f6cbf;
-  font-size: 0.8203125rem;
-  font-weight: bold;
-}
-.btn.add-section:hover, .btn.add-section:focus {
-  background-color: #e7f0f9;
-  border: 2px solid #0f6cbf;
-  color: #0f6cbf;
-}
-
 .max-section-alert {
   border-top: 2px dashed #dee2e6;
   font-size: 0.8203125rem;
@@ -37499,6 +37486,24 @@ p.arrow_button {
   box-shadow: inset 0 0 0 2px #fff;
 }
 
+/*
+ * Add content buttons.
+ */
+.btn-add-content {
+  border-radius: 0.5rem;
+  border: 2px dashed #dee2e6;
+  color: #0f6cbf;
+  background-color: #fff;
+  font-size: 0.8203125rem;
+  font-weight: bold;
+}
+.btn-add-content:hover, .btn-add-content:focus {
+  background-color: #e7f0f9;
+  border-style: solid;
+  border-color: #0f6cbf;
+  color: #0f6cbf;
+}
+
 .gradetreebox {
   margin: 20px 0 30px 0;
 }
diff --git a/theme/classic/style/moodle.css b/theme/classic/style/moodle.css
index f16f489003b..36242d5ee12 100644
--- a/theme/classic/style/moodle.css
+++ b/theme/classic/style/moodle.css
@@ -30629,19 +30629,6 @@ table.calendartable caption {
   display: block;
 }
 
-.btn.add-section {
-  border-radius: 1rem;
-  border: 2px dashed #dee2e6;
-  color: #0f6cbf;
-  font-size: 0.8203125rem;
-  font-weight: bold;
-}
-.btn.add-section:hover, .btn.add-section:focus {
-  background-color: #e7f0f9;
-  border: 2px solid #0f6cbf;
-  color: #0f6cbf;
-}
-
 .max-section-alert {
   border-top: 2px dashed #dee2e6;
   font-size: 0.8203125rem;
@@ -37499,6 +37486,24 @@ p.arrow_button {
   box-shadow: inset 0 0 0 2px #fff;
 }
 
+/*
+ * Add content buttons.
+ */
+.btn-add-content {
+  border-radius: 0.375rem;
+  border: 2px dashed #dee2e6;
+  color: #0f6cbf;
+  background-color: #fff;
+  font-size: 0.8203125rem;
+  font-weight: bold;
+}
+.btn-add-content:hover, .btn-add-content:focus {
+  background-color: #e7f0f9;
+  border-style: solid;
+  border-color: #0f6cbf;
+  color: #0f6cbf;
+}
+
 .gradetreebox {
   margin: 20px 0 30px 0;
 }