diff --git a/frontend/playwright/ui/visual-specs/workspace.spec.js b/frontend/playwright/ui/visual-specs/workspace.spec.js
index a99ea0b020..bff404fdd3 100644
--- a/frontend/playwright/ui/visual-specs/workspace.spec.js
+++ b/frontend/playwright/ui/visual-specs/workspace.spec.js
@@ -54,6 +54,31 @@ test.describe("Viewport", () => {
 });
 
 test.describe("Design tab", () => {
+  test("Shows the boolean options when selecting two shapes", async ({
+    page,
+  }) => {
+    const workspace = new WorkspacePage(page);
+    await workspace.setupEmptyFile();
+    await workspace.goToWorkspace();
+
+    await workspace.rectShapeButton.click();
+    await workspace.clickWithDragViewportAt(128, 128, 200, 100);
+    await workspace.clickLeafLayer("Rectangle");
+    await page.keyboard.press("Control+D");
+    await expect(workspace.layers.getByText("Rectangle")).toHaveCount(2);
+    await page.keyboard.press("Control+A");
+
+    await expect(
+      workspace.rightSidebar.getByRole("button", { name: "Flatten" }),
+    ).toBeVisible();
+    // The boolean options are a small part of the sidebar: compare every
+    // pixel.
+    await expect(workspace.rightSidebar).toHaveScreenshot({
+      maxDiffPixelRatio: 0,
+      threshold: 0,
+    });
+  });
+
   test("Shows the design tab when selecting a shape", async ({ page }) => {
     const workspace = new WorkspacePage(page);
     await workspace.setupEmptyFile();
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.cljs b/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.cljs
index 46801115ad..84345ef667 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.cljs
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.cljs
@@ -16,14 +16,11 @@
    [app.main.features :as features]
    [app.main.store :as st]
    [app.main.ui.components.radio-buttons :refer [radio-button radio-buttons]]
+   [app.main.ui.ds.buttons.icon-button :refer [icon-button*]]
    [app.main.ui.ds.foundations.assets.icon :as i]
-   [app.main.ui.icons :as deprecated-icon]
    [app.util.i18n :as i18n :refer [tr]]
    [rumext.v2 :as mf]))
 
-(def ^:private flatten-icon
-  (deprecated-icon/icon-xref :boolean-flatten (stl/css :flatten-icon)))
-
 (mf/defc bool-options*
   [{:keys [total-selected shapes shapes-with-children]}]
   (let [head      (first shapes)
@@ -100,11 +97,9 @@
                            :title (str (tr "workspace.shape.menu.exclude") " (" (sc/get-tooltip :bool-exclude) ")")
                            :id "bool-opt-exclude"}]]]
 
-       [:button
-        {:title (tr "workspace.shape.menu.flatten")
-         :class (stl/css-case
-                 :flatten-button true
-                 :disabled disabled-flatten)
-         :disabled disabled-flatten
-         :on-click flatten-objects}
-        flatten-icon]])))
+       [:> icon-button* {:variant "ghost"
+                         :tooltip-class (stl/css :flatten-button)
+                         :aria-label (tr "workspace.shape.menu.flatten")
+                         :icon i/boolean-flatten
+                         :disabled disabled-flatten
+                         :on-click flatten-objects}]])))
diff --git a/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.scss b/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.scss
index 50c8ae0625..2a03d0fd51 100644
--- a/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.scss
+++ b/frontend/src/app/main/ui/workspace/sidebar/options/menus/bool.scss
@@ -4,13 +4,12 @@
 //
 // Copyright (c) KALEIDOS SUBSIDIARY SL
 
-@use "refactor/common-refactor.scss" as deprecated;
 @use "../../../sidebar/common/sidebar.scss" as sidebar;
 
 .boolean-options {
   @include sidebar.option-grid-structure;
 
-  height: var(--sp-xxxl);
+  block-size: var(--sp-xxxl);
 }
 
 .bool-group {
@@ -20,32 +19,7 @@
 }
 
 .flatten-button {
-  @extend %button-tertiary;
-
-  height: deprecated.$s-32;
-  width: deprecated.$s-32;
-  border-radius: deprecated.$br-8;
   grid-column: 5 / span 1;
-
-  --flatten-icon-foreground-color: var(--icon-foreground);
-
-  &.disabled {
-    cursor: default;
-
-    --flatten-icon-foreground-color: var(--button-foreground-color-disabled);
-
-    &:hover {
-      background-color: var(--panel-background-color);
-
-      --flatten-icon-foreground-color: var(--button-foreground-color-disabled);
-    }
-  }
-}
-
-.flatten-icon {
-  @extend %button-icon;
-
-  stroke: var(--flatten-icon-foreground-color);
 }
 
 .boolean-radio-btn {