diff --git a/src/frontend/lang/lang-en.ts b/src/frontend/lang/lang-en.ts
index b8176bceee62dcc38f4141c561c485f0734b7023..48f69a018c2901371e9e7689d4693a659772e08e 100755
--- a/src/frontend/lang/lang-en.ts
+++ b/src/frontend/lang/lang-en.ts
@@ -1866,5 +1866,7 @@ export const LANG_EN = {
     "root_invisible": "Administrator (invisible)",
     "standard": "Default",
     "accountType": "Account type",
-    "beginInstall": "Start installation"
+    "beginInstall": "Start installation",
+    "hideTool": "Hide toolbar",
+    "showTool": "Show toolbar"
 };
\ No newline at end of file
diff --git a/src/frontend/lang/lang-fr.ts b/src/frontend/lang/lang-fr.ts
index fc36da310ec73dc6031fb3250034d5a9769e64cd..69887138aeafb4c4cc4cb8ea59a732b5431ff0ab 100755
--- a/src/frontend/lang/lang-fr.ts
+++ b/src/frontend/lang/lang-fr.ts
@@ -1861,5 +1861,7 @@ export const LANG_FR = {
     "root_invisible": "Administrateur (invisible)",
     "standard": "Standard",
     "accountType": "Type de compte",
-    "beginInstall": "Commencer l'installation"  
+    "beginInstall": "Commencer l'installation",
+    "hideTool": "Cacher la barre d'outils",
+    "showTool": "Afficher la barre d'outils"
 };
diff --git a/src/frontend/lang/lang-nl.ts b/src/frontend/lang/lang-nl.ts
index c71061aadc43c5bdedb2258b93d4aa43224d9c94..f03aeb170a1d280c8ac08f933e1b74e0b5ca0239 100755
--- a/src/frontend/lang/lang-nl.ts
+++ b/src/frontend/lang/lang-nl.ts
@@ -1878,5 +1878,7 @@ export const LANG_NL = {
     "root_invisible": "Administrateur (invisible)__TO_TRANSLATE",
     "standard": "Standard__TO_TRANSLATE",
     "accountType": "Type de compte__TO_TRANSLATE",
-    "beginInstall": "Commencer l'installation__TO_TRANSLATE"
+    "beginInstall": "Commencer l'installation__TO_TRANSLATE",
+    "hideTool": "Cacher la barre d'outils__TO_TRANSLATE",
+    "showTool": "Afficher la barre d'outils__TO_TRANSLATE"
 };
\ No newline at end of file
diff --git a/src/frontend/plugins/collabora-online/collabora-online-viewer.component.html b/src/frontend/plugins/collabora-online/collabora-online-viewer.component.html
index c917a0caf08f05746fb2aa9b0d204cde30017bd7..8ea62b21923955f27baad333e603c7e714c0575a 100644
--- a/src/frontend/plugins/collabora-online/collabora-online-viewer.component.html
+++ b/src/frontend/plugins/collabora-online/collabora-online-viewer.component.html
@@ -1,20 +1,16 @@
 <div *ngIf="loading" style="display:block;padding: 10px;">{{lang.checkCollaboraOnlineServer}}...</div>
-<button *ngIf="!hideButtons" class="collaboraOnlineButton_fullscreen" [class.fullScreen]="fullscreenMode" mat-mini-fab color="warn"
+<button  class="collaboraOnlineButton_fullscreen" [class.buttonsHide]="hideButtons" [class.fullScreen]="fullscreenMode" mat-mini-fab color="warn"
     [title]="lang.closeEditor" (click)="quit()">
     <mat-icon class="fa fa-times" style="height:auto;"></mat-icon>
 </button>
-<button *ngIf="!hideButtons" mat-mini-fab class="collaboraOnlineButton_close" [class.fullScreen]="fullscreenMode" color="default"
+<button mat-mini-fab class="collaboraOnlineButton_close" [class.buttonsHide]="hideButtons" [class.fullScreen]="fullscreenMode" color="default"
     [title]="fullscreenMode ? lang.closeFullscreen : lang.openFullscreen" (click)="openFullscreen()">
     <mat-icon class="fas" [class.fa-expand]="!fullscreenMode" [class.fa-compress]="fullscreenMode" style="height:auto;"></mat-icon>
 </button>
-<button *ngIf="!hideButtons" class="collaboraOnlineButton_hide" [class.fullScreen]="fullscreenMode" mat-mini-fab color="default"
+<button class="collaboraOnlineButton_hide" [class.buttonsHide]="hideButtons" [class.fullScreen]="fullscreenMode" mat-mini-fab color="default"
         [title]="lang.closeEditor" (click)="hideButtons = !hideButtons">
     <mat-icon class="fa fa-arrow-right" style="height:auto;"></mat-icon>
 </button>
-<button *ngIf="hideButtons" class="collaboraOnlineButton_show" [class.fullScreen]="fullscreenMode" mat-mini-fab color="default"
-        [title]="lang.closeEditor" (click)="hideButtons = !hideButtons">
-    <mat-icon class="fa fa-arrow-left" style="height:auto;"></mat-icon>
-</button>
 
 <iframe #collaboraFrame *ngIf="editorUrl !== ''" [src]="editorUrl" id="collabora" width="100%" height="100%" name="frameEditor">
 
diff --git a/src/frontend/plugins/collabora-online/collabora-online-viewer.component.scss b/src/frontend/plugins/collabora-online/collabora-online-viewer.component.scss
index 8ba1659b48805a5f54ee6f5edf6253c812bc5ee8..2fbbfeabb6d12475ffe3aab85f72091a4e92a4fc 100644
--- a/src/frontend/plugins/collabora-online/collabora-online-viewer.component.scss
+++ b/src/frontend/plugins/collabora-online/collabora-online-viewer.component.scss
@@ -3,6 +3,7 @@
     position: absolute;
     top: 12px;
     z-index: 3;
+    transition: all 0.5s;
 }
 
 .collaboraOnlineButton {
@@ -28,3 +29,10 @@
     top: 0px;
     left: 0px;
 }
+
+.buttonsHide {
+    top: -15px;
+    right: -15px;
+    transform: rotate(125deg);
+    transition: all 0.5s;
+}
diff --git a/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.html b/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.html
index 0a27f305860aedae59ff8d8aa5c5709e65961798..cf3b4cfab039d5d4949026470ab9d561a362e6a3 100644
--- a/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.html
+++ b/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.html
@@ -1,19 +1,15 @@
 <div *ngIf="loading" style="display:block;padding: 10px;">{{lang.checkOnlyofficeServer}}...</div>
-<button *ngIf="!hideCloseEditor && !hideButtons" class="onlyofficeButton_fullscreen" [class.fullScreen]="fullscreenMode" mat-mini-fab color="warn"
+<button *ngIf="!hideCloseEditor" class="onlyofficeButton_fullscreen" [class.buttonsHide]="hideButtons" [class.fullScreen]="fullscreenMode" mat-mini-fab color="warn"
     [title]="lang.closeEditor" (click)="quit()">
     <mat-icon class="fa fa-times" style="height:auto;"></mat-icon>
 </button>
-<button *ngIf="!hideButtons" mat-mini-fab class="onlyofficeButton_close" [class.fullScreen]="fullscreenMode" color="default"
+<button mat-mini-fab class="onlyofficeButton_close" [class.buttonsHide]="hideButtons" [class.fullScreen]="fullscreenMode" color="default"
     [title]="fullscreenMode ? lang.closeFullscreen : lang.openFullscreen" (click)="openFullscreen()">
     <mat-icon class="fas" [class.fa-expand]="!fullscreenMode" [class.fa-compress]="fullscreenMode" style="height:auto;"></mat-icon>
 </button>
-<button *ngIf="!hideButtons" class="onlyofficeButton_hide" [class.fullScreen]="fullscreenMode" mat-mini-fab color="default"
-        [title]="lang.closeEditor" (click)="hideButtons = !hideButtons">
+<button class="onlyofficeButton_hide" [class.fullScreen]="fullscreenMode" [class.buttonsHide]="hideButtons" mat-mini-fab color="default"
+        [title]="!hideButtons ? lang.hideTool : lang.showTool" (click)="hideButtons = !hideButtons">
     <mat-icon class="fa fa-arrow-right" style="height:auto;"></mat-icon>
 </button>
-<button *ngIf="hideButtons" class="onlyofficeButton_show" [class.fullScreen]="fullscreenMode" mat-mini-fab color="default"
-        [title]="lang.closeEditor" (click)="hideButtons = !hideButtons">
-    <mat-icon class="fa fa-arrow-left" style="height:auto;"></mat-icon>
-</button>
 
 <div id="placeholder"></div>
diff --git a/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.scss b/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.scss
index ed1160cfb295a5b5d4d1ac7ef26ddfe4333ba1e0..662a1afc0853e6c716a644d11635e1c96bd9ed09 100644
--- a/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.scss
+++ b/src/frontend/plugins/onlyoffice-api-js/onlyoffice-viewer.component.scss
@@ -3,6 +3,7 @@
     position: absolute;
     top: 12px;
     z-index: 3;
+    transition: all 0.5s;
 }
 
 .onlyofficeButton {
@@ -28,3 +29,10 @@
     top: 0px;
     left: 0px;
 }
+
+.buttonsHide {
+    top: -15px;
+    right: -15px;
+    transform: rotate(125deg);
+    transition: all 0.5s;
+}