diff --git a/public/css/welcome.css b/public/css/welcome.css
index 9e691f42e..c1051ccde 100644
--- a/public/css/welcome.css
+++ b/public/css/welcome.css
@@ -10,6 +10,13 @@
     padding-bottom: 5px;
 }
 
+.welcomePanel.recentHidden .welcomeRecent,
+.welcomePanel.recentHidden .recentChatsTitle,
+.welcomePanel.recentHidden .hideRecentChats,
+.welcomePanel:not(.recentHidden) .showRecentChats {
+    display: none;
+}
+
 body.bubblechat .welcomePanel {
     border-radius: 10px;
     background-color: var(--SmartThemeBotMesBlurTintColor);
@@ -42,6 +49,7 @@ body.bubblechat .welcomePanel {
 .welcomePanel .welcomeHeaderVersionDisplay {
     font-size: calc(var(--mainFontSize) * 1.3);
     font-weight: 600;
+    flex-grow: 1;
 }
 
 .welcomePanel .welcomeHeaderLogo {
diff --git a/public/scripts/templates/welcomePanel.html b/public/scripts/templates/welcomePanel.html
index e428f2fdd..61c6e4ee7 100644
--- a/public/scripts/templates/welcomePanel.html
+++ b/public/scripts/templates/welcomePanel.html
@@ -2,6 +2,12 @@
     <div class="welcomeHeaderTitle">
         <img src="img/logo.png" alt="SillyTavern Logo" class="welcomeHeaderLogo">
         <span class="welcomeHeaderVersionDisplay">{{version}}</span>
+        <div class="mes_button showRecentChats" title="Show recent chats" data-i18n="[title]Show recent chats">
+            <i class="fa-solid fa-circle-chevron-down fa-fw fa-lg"></i>
+        </div>
+        <div class="mes_button hideRecentChats" title="Hide recent chats" data-i18n="[title]Hide recent chats">
+            <i class="fa-solid fa-circle-xmark fa-fw fa-lg"></i>
+        </div>
     </div>
     <div class="welcomeHeader">
         <div class="recentChatsTitle" data-i18n="Recent Chats">
diff --git a/public/scripts/welcome-screen.js b/public/scripts/welcome-screen.js
index 2f449c858..8f483aa42 100644
--- a/public/scripts/welcome-screen.js
+++ b/public/scripts/welcome-screen.js
@@ -94,6 +94,25 @@ async function sendWelcomePanel() {
         };
         const template = await renderTemplateAsync('welcomePanel', templateData);
         const fragment = document.createRange().createContextualFragment(template);
+        fragment.querySelectorAll('.welcomePanel').forEach((root) => {
+            const recentHiddenClass = 'recentHidden';
+            const recentHiddenKey = 'WelcomePage_RecentChatsHidden';
+            if (accountStorage.getItem(recentHiddenKey) === 'true') {
+                root.classList.add(recentHiddenClass);
+            }
+            root.querySelectorAll('.showRecentChats').forEach((button) => {
+                button.addEventListener('click', () => {
+                    root.classList.remove(recentHiddenClass);
+                    accountStorage.setItem(recentHiddenKey, 'false');
+                });
+            });
+            root.querySelectorAll('.hideRecentChats').forEach((button) => {
+                button.addEventListener('click', () =>{
+                    root.classList.add(recentHiddenClass);
+                    accountStorage.setItem(recentHiddenKey, 'true');
+                });
+            });
+        });
         fragment.querySelectorAll('.recentChat').forEach((item) => {
             item.addEventListener('click', () => {
                 const avatarId = item.getAttribute('data-avatar');