diff --git a/web/src/components/navbar/ToggleButton.js b/web/src/components/navbar/ToggleButton.js
index 4ee9bf37..0cc69536 100644
--- a/web/src/components/navbar/ToggleButton.js
+++ b/web/src/components/navbar/ToggleButton.js
@@ -1,10 +1,11 @@
 import React from 'react';
 import { Button, UncontrolledTooltip } from 'reactstrap';
+import { withTranslation } from 'react-i18next';
 
-const ToggleButton = ({ isNavbarVerticalCollapsed, setIsNavbarVerticalCollapsed }) => (
+const ToggleButton = ({ isNavbarVerticalCollapsed, setIsNavbarVerticalCollapsed, t }) => (
   <>
     <UncontrolledTooltip placement="left" target="toggleNavigationTooltip">
-      Toggle Navigation
+      {t('Toggle Navigation')}
     </UncontrolledTooltip>
     <div className="toggle-icon-wrapper">
       <Button
@@ -24,4 +25,4 @@ const ToggleButton = ({ isNavbarVerticalCollapsed, setIsNavbarVerticalCollapsed
   </>
 );
 
-export default ToggleButton;
+export default withTranslation()(ToggleButton);
diff --git a/web/src/i18n.js b/web/src/i18n.js
index 3d0e8aa8..fde945d5 100644
--- a/web/src/i18n.js
+++ b/web/src/i18n.js
@@ -346,6 +346,8 @@ const resources = {
       "Bank Name": "Bank Name",
       "Bank Address": "Bank Address",
       "RMB Account": "RMB Account",
+      // button
+      "Toggle Navigation": "Toggle Navigation",
     }
   },
   de: {
@@ -693,6 +695,8 @@ const resources = {
       "Bank Name": "Bank Name",
       "Bank Address": "Bankadresse",
       "RMB Account": "RMB-Konto",
+      // button
+      "Toggle Navigation": "Navigation umschalten",
     }
   },
   zh_cn: {
@@ -1040,6 +1044,8 @@ const resources = {
       "Bank Name": "开户银行",
       "Bank Address": "银行地址",
       "RMB Account": "人民币账户",
+      // button
+      "Toggle Navigation": "切换导航",
     }
   }
 };