diff --git a/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js b/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
index 3a535596171..6b281b9a34e 100644
--- a/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
+++ b/addons/web_editor/static/src/js/wysiwyg/widgets/link_tools.js
@@ -73,8 +73,9 @@ const LinkTools = Link.extend({
             this.colorpickers[cssProperty].$el.appendTo(locationEl);
         }
         const customStyleProps = ['color', 'background-color', 'background-image', 'border-width', 'border-style', 'border-color'];
-        if (customStyleProps.some(s => link.style[s])) {
-            // Force custom style if style exists on the link.
+        const shapeClasses = ['btn-outline-primary', 'btn-outline-secondary', 'btn-fill-primary', 'btn-fill-secondary', 'rounded-circle', 'flat'];
+        if (customStyleProps.some(s => link.style[s]) || shapeClasses.some(c => link.classList.contains(c))) {
+            // Force custom style if style or shape exists on the link.
             const customOption = this.el.querySelector('[name="link_style_color"] we-button[data-value="custom"]');
             this._setSelectOption($(customOption), true);
             this._updateOptionsUI();
@@ -254,10 +255,14 @@ const LinkTools = Link.extend({
         const el = this.el.querySelector('[name="link_style_color"] we-button.active');
         if (el) {
             this.colorCombinationClass = el.dataset.value;
-            // Hide the size and shape options if the link is an unstyled anchor.
-            this.$('.link-size-row, .link-shape-row').toggleClass('d-none', !this.colorCombinationClass);
-            // Show custom colors only for Custom style.
-            this.$('.link-custom-color').toggleClass('d-none', el.dataset.value !== 'custom');
+            // Hide the size option if the link is an unstyled anchor.
+            for (const rowEl of this.el.querySelectorAll('.link-size-row')) {
+                rowEl.classList.toggle('d-none', !this.colorCombinationClass);
+            }
+            // Show custom colors and shape only for Custom style.
+            for (const rowEl of this.el.querySelectorAll('.link-custom-color, .link-shape-row')) {
+                rowEl.classList.toggle('d-none', el.dataset.value !== 'custom');
+            }
 
             // Note: the _updateColorpicker method is supposedly async but can
             // be used synchronously given the fact that _addColorPicker was
diff --git a/addons/web_editor/static/src/xml/wysiwyg.xml b/addons/web_editor/static/src/xml/wysiwyg.xml
index 6fc7f89a951..6f28d31b206 100644
--- a/addons/web_editor/static/src/xml/wysiwyg.xml
+++ b/addons/web_editor/static/src/xml/wysiwyg.xml
@@ -277,7 +277,7 @@
             </div>
         </we-row>
         <we-row class="link-size-row">
-            <we-select class="o_we_user_value_widget o_we_sublevel_1">
+            <we-select class="o_we_user_value_widget o_we_sublevel_2">
                 <we-title>Size</we-title>
                 <div>
                     <div class="dropdown">
@@ -303,7 +303,7 @@
             </we-select>
         </we-row>
         <we-row class="link-shape-row">
-            <we-select class="o_we_user_value_widget o_we_sublevel_1">
+            <we-select class="o_we_user_value_widget o_we_sublevel_2">
                 <we-title>Shape</we-title>
                 <div>
                     <div class="dropdown">
diff --git a/addons/website_mass_mailing/static/tests/tours/snippet_newsletter_block_with_edit.js b/addons/website_mass_mailing/static/tests/tours/snippet_newsletter_block_with_edit.js
index c5f1d652dcb..02f42b61c59 100644
--- a/addons/website_mass_mailing/static/tests/tours/snippet_newsletter_block_with_edit.js
+++ b/addons/website_mass_mailing/static/tests/tours/snippet_newsletter_block_with_edit.js
@@ -46,6 +46,20 @@ wTourUtils.registerWebsitePreviewTour('snippet_newsletter_block_with_edit', {
         content: 'Click on the primary style button',
         trigger: '[data-value="primary"]',
     },
+    {
+        content: 'Verify that the shape option is not available for primary while the size option appeared',
+        trigger: 'we-customizeblock-option:not(:has([name="link_style_shape"]))',
+        extra_trigger: 'we-customizeblock-option:has([name="link_style_size"])',
+        isCheck: true,
+    },
+    {
+        content: 'Click on the link style button',
+        trigger: '.dropdown:has([name="link_style_color"]) > button',
+    },
+    {
+        content: 'Click on the custom style button',
+        trigger: '[data-value="custom"]',
+    },
     {
         content: 'Change the shape of the button',
         trigger: '.dropdown:has([name="link_style_shape"]) > button',
@@ -60,6 +74,6 @@ wTourUtils.registerWebsitePreviewTour('snippet_newsletter_block_with_edit', {
     // prevent to edit the button).
     {
         content: 'Check that the link style is correct',
-        trigger: 'iframe .s_newsletter_block .js_subscribed_btn.btn.btn-primary.flat:not(.btn-success)',
+        trigger: 'iframe .s_newsletter_block .js_subscribed_btn.btn.btn-custom.flat:not(.btn-success)',
     },
 ]);