diff --git a/apps/client/src/widgets/buttons/left_pane_toggle.css b/apps/client/src/widgets/buttons/left_pane_toggle.css
new file mode 100644
index 000000000..0946c6ed4
--- /dev/null
+++ b/apps/client/src/widgets/buttons/left_pane_toggle.css
@@ -0,0 +1,25 @@
+@keyframes left-pane-toggle-button-expand {
+    from {
+        transform: rotate(0deg);
+    } to {
+        transform: rotate(180deg);
+    }
+}
+
+@keyframes left-pane-toggle-button-collapse {
+    from {
+        transform: rotate(180deg);
+    } to {
+        transform: rotate(360deg);
+    }
+}
+
+.layout-vertical .left-pane-toggle-button.action-collapse::before {
+    transform: rotate(360deg);
+    animation: left-pane-toggle-button-collapse 250ms linear;
+}
+
+.layout-vertical .left-pane-toggle-button.action-expand::before {
+    transform: rotate(180deg);
+    animation: left-pane-toggle-button-expand 250ms linear;
+}
\ No newline at end of file
diff --git a/apps/client/src/widgets/buttons/left_pane_toggle.tsx b/apps/client/src/widgets/buttons/left_pane_toggle.tsx
index f6c4b3ab8..106c4be00 100644
--- a/apps/client/src/widgets/buttons/left_pane_toggle.tsx
+++ b/apps/client/src/widgets/buttons/left_pane_toggle.tsx
@@ -1,3 +1,4 @@
+import "./left_pane_toggle.css";
 import { useEffect, useState } from "preact/hooks";
 import ActionButton from "../react/ActionButton";
 import options from "../../services/options";
@@ -18,12 +19,10 @@ export default function LeftPaneToggle({ isHorizontalLayout }: { isHorizontalLay
 
     return (
         <ActionButton
-            className={`${isHorizontalLayout ? "toggle-button" : "launcher-button"}`}
+            className={`${isHorizontalLayout ? "toggle-button" : "launcher-button"} left-pane-toggle-button ${currentLeftPaneVisible ? "action-collapse" : "action-expand"}`}
             text={currentLeftPaneVisible ? t("left_pane_toggle.hide_panel") : t("left_pane_toggle.show_panel")}
             triggerCommand={currentLeftPaneVisible ? "hideLeftPane" : "showLeftPane"}
-            icon={isHorizontalLayout
-                ? "bx bx-sidebar"
-                : (currentLeftPaneVisible ? "bx bx-chevrons-left" : "bx bx-chevrons-right" )}
+            icon={isHorizontalLayout ? "bx bx-sidebar" : "bx bx-chevrons-left"}
         />
     )
 }
\ No newline at end of file