diff --git a/apps/client/src/widgets/mobile_widgets/TabSwitcher.css b/apps/client/src/widgets/mobile_widgets/TabSwitcher.css
new file mode 100644
index 000000000..d9e49f89e
--- /dev/null
+++ b/apps/client/src/widgets/mobile_widgets/TabSwitcher.css
@@ -0,0 +1,6 @@
+.modal.tab-bar-modal {
+    .modal-dialog {
+        max-height: unset;
+        height: 95vh;
+    }
+}
diff --git a/apps/client/src/widgets/mobile_widgets/TabSwitcher.tsx b/apps/client/src/widgets/mobile_widgets/TabSwitcher.tsx
index 50d74c5ad..735dbfc98 100644
--- a/apps/client/src/widgets/mobile_widgets/TabSwitcher.tsx
+++ b/apps/client/src/widgets/mobile_widgets/TabSwitcher.tsx
@@ -1,15 +1,40 @@
+import "./TabSwitcher.css";
+
+import { createPortal } from "preact/compat";
+import { useState } from "preact/hooks";
+
 import { LaunchBarActionButton } from "../launch_bar/launch_bar_widgets";
+import Modal from "../react/Modal";
 
 export default function TabSwitcher() {
+    const [ shown, setShown ] = useState(false);
+
     return (
         <>
             <LaunchBarActionButton
                 icon="bx bx-rectangle"
                 text="Tabs"
-                onClick={() => {
-
-                }}
+                onClick={() => setShown(true)}
             />
+            {createPortal(<TabBarModal shown={shown} setShown={setShown} />, document.body)}
         </>
     );
 }
+
+
+function TabBarModal({ shown, setShown }: {
+    shown: boolean;
+    setShown: (newValue: boolean) => void;
+}) {
+    return (
+        <Modal
+            className="tab-bar-modal"
+            size="xl"
+            title="Tabs"
+            show={shown}
+            onHidden={() => setShown(false)}
+        >
+            Hi
+        </Modal>
+    );
+}