diff --git a/frontend/src/components/chat/ChatMessages.jsx b/frontend/src/components/chat/ChatMessages.jsx
index 32b83f2..d52c712 100644
--- a/frontend/src/components/chat/ChatMessages.jsx
+++ b/frontend/src/components/chat/ChatMessages.jsx
@@ -2,7 +2,7 @@ import React, { useState, useEffect, useRef } from 'react';
 import ReactMarkdown from 'react-markdown';
 import { Prism as SyntaxHighlighter } from 'react-syntax-highlighter';
 import { vscDarkPlus } from 'react-syntax-highlighter/dist/esm/styles/prism';
-import { FiUser, FiCpu, FiCopy, FiCheck, FiInfo } from 'react-icons/fi';
+import { FiUser, FiCpu, FiCopy, FiCheck, FiInfo, FiChevronDown } from 'react-icons/fi';
 
 const ChatMessages = ({ messages }) => {
   const [hoveredMessage, setHoveredMessage] = useState(null);
@@ -374,6 +374,17 @@ const ChatMessages = ({ messages }) => {
         </div>
       ))}
       <div ref={messagesEndRef} style={{ height: '1px', width: '100%' }} />
+
+      {userScrolled && (
+        <button
+          className="scroll-to-bottom-btn"
+          onClick={scrollToBottom}
+          aria-label="Scroll to bottom"
+          title="Scroll to bottom"
+        >
+          <FiChevronDown size={18} />
+        </button>
+      )}
     </div>
   );
 };
diff --git a/frontend/src/styles/opendeepwiki-theme.css b/frontend/src/styles/opendeepwiki-theme.css
index ff4ca74..37fd64b 100644
--- a/frontend/src/styles/opendeepwiki-theme.css
+++ b/frontend/src/styles/opendeepwiki-theme.css
@@ -1259,4 +1259,41 @@ img {
 @keyframes spin {
   from { transform: rotate(0deg); }
   to { transform: rotate(360deg); }
-}
\ No newline at end of file
+}
+/* Scroll to Bottom Button */
+.scroll-to-bottom-btn {
+  position: fixed;
+  bottom: 120px;
+  right: 2rem;
+  z-index: 100;
+  background-color: var(--chatgpt-sidebar-bg);
+  border: 1px solid var(--chatgpt-border);
+  color: var(--chatgpt-text);
+  border-radius: 50%;
+  width: 32px;
+  height: 32px;
+  display: flex;
+  align-items: center;
+  justify-content: center;
+  cursor: pointer;
+  box-shadow: 0 2px 10px rgba(0,0,0,0.2);
+  transition: all 0.2s ease;
+  opacity: 0.8;
+}
+
+.scroll-to-bottom-btn:hover {
+  background-color: rgba(255, 255, 255, 0.1);
+  transform: scale(1.1);
+  opacity: 1;
+}
+
+.scroll-to-bottom-btn:active {
+  transform: scale(0.95);
+}
+
+@media (max-width: 768px) {
+  .scroll-to-bottom-btn {
+    bottom: 110px;
+    right: 1rem;
+  }
+}