diff --git a/app.py b/app.py
index 2538c1b..23df7ec 100644
--- a/app.py
+++ b/app.py
@@ -1,8 +1,9 @@
-#import eventlet
-#eventlet.monkey_patch()
+# import eventlet
+# eventlet.monkey_patch()
 
 import gevent
 from gevent import monkey
+
 monkey.patch_all()
 
 
@@ -28,7 +29,7 @@ app.config["SQLALCHEMY_TRACK_MODIFICATIONS"] = False
 
 db = SQLAlchemy(app)
 
-#socketio = SocketIO(app, async_mode="eventlet")
+# socketio = SocketIO(app, async_mode="eventlet")
 socketio = SocketIO(app, async_mode="gevent")
 
 # Global dictionary to keep track of cancellation requests
@@ -138,6 +139,72 @@ def chat(room_name):
     )
 
 
+@app.route("/search")
+def search_page():
+    # Query all rooms so that newest is first.
+    rooms = Room.query.order_by(Room.id.desc()).all()
+
+    keywords = request.args.get("keywords", "")
+    username = request.args.get("username", "guest")
+    if not keywords:
+        return render_template(
+            "search.html",
+            rooms=rooms,
+            keywords=keywords,
+            results=[],
+            username=username,
+            error="Keywords are required",
+        )
+
+    # Call the function to search messages
+    search_results = search_messages(keywords)
+
+    return render_template(
+        "search.html",
+        rooms=rooms,
+        keywords=keywords,
+        results=search_results,
+        username=username,
+        error=None,
+    )
+
+
+def search_messages(keywords):
+    search_results = {}
+
+    # Split the keywords by spaces
+    keyword_list = keywords.lower().split()
+
+    # Search for messages containing any of the keywords
+    messages = Message.query.filter(
+        db.or_(*[Message.content.ilike(f"%{keyword}%") for keyword in keyword_list])
+    ).all()
+
+    for message in messages:
+        room = Room.query.get(message.room_id)
+        if room:
+            # Calculate the score based on the number of occurrences of all keywords
+            score = sum(
+                message.content.lower().count(keyword) for keyword in keyword_list
+            )
+
+            if room.id not in search_results:
+                search_results[room.id] = {
+                    "room_id": room.id,
+                    "room_name": room.name,
+                    "room_title": room.title,
+                    "score": 0,
+                }
+
+            search_results[room.id]["score"] += score
+
+    # Convert the dictionary to a list and sort results by score in descending order
+    search_results_list = list(search_results.values())
+    search_results_list.sort(key=lambda x: x["score"], reverse=True)
+
+    return search_results_list
+
+
 @socketio.on("join")
 def on_join(data):
     room_name = data["room_name"]
@@ -462,32 +529,32 @@ def group_consecutive_roles(messages):
         return []
 
     grouped_messages = []
-    current_role = messages[0]['role']
+    current_role = messages[0]["role"]
     current_content = []
 
     for message in messages:
-        if message['role'] == current_role:
-            current_content.append(message['content'])
+        if message["role"] == current_role:
+            current_content.append(message["content"])
         else:
-            grouped_messages.append({
-                'role': current_role,
-                'content': ' '.join(current_content)
-            })
-            current_role = message['role']
-            current_content = [message['content']]
+            grouped_messages.append(
+                {"role": current_role, "content": " ".join(current_content)}
+            )
+            current_role = message["role"]
+            current_content = [message["content"]]
 
     # Append the last grouped message
-    grouped_messages.append({
-        'role': current_role,
-        'content': ' '.join(current_content)
-    })
+    grouped_messages.append(
+        {"role": current_role, "content": " ".join(current_content)}
+    )
 
     return grouped_messages
 
 
 def chat_claude(
-    #username, room_name, model_name="anthropic.claude-3-5-sonnet-20240620-v1:0"
-    username, room_name, model_name="anthropic.claude-3-sonnet-20240229-v1:0"
+    # username, room_name, model_name="anthropic.claude-3-5-sonnet-20240620-v1:0"
+    username,
+    room_name,
+    model_name="anthropic.claude-3-sonnet-20240229-v1:0",
 ):
     with app.app_context():
         room = get_room(room_name)
diff --git a/templates/base.html b/templates/base.html
new file mode 100644
index 0000000..34c3423
--- /dev/null
+++ b/templates/base.html
@@ -0,0 +1,219 @@
+<!DOCTYPE html>
+<html lang="en">
+<head>
+    <meta charset="UTF-8">
+    <meta name="viewport" content="width=device-width, initial-scale=1.0">
+    <title>{% block title %}Chatroom{% endblock %}</title>
+
+    <!-- Include highlight.js library for syntax highlighting -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
+    <!-- Include a highlight.js theme (replace 'default' with your preferred theme) -->
+    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css">
+
+    <!-- Include socket.io for real-time bidirectional event-based communication -->
+    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.min.js"></script>
+    <!-- Include marked.js for markdown parsing -->
+    <script 
+      src="https://cdnjs.cloudflare.com/ajax/libs/marked/9.1.2/marked.min.js" 
+      integrity="sha512-rfX4p3RNnxdwLT3wWP1K0NR3ztTobn+sISlT9WhxDDK00zNYbQ6MCHA5OHm0hqKAzEMXYCgFrp8iY/ER5MkXqA==" 
+      crossorigin="anonymous" 
+      referrerpolicy="no-referrer">
+    </script>
+
+    <!-- Include DOMPurify to sanitize HTML and prevent XSS attacks -->
+    <script src="https://cdn.jsdelivr.net/npm/dompurify@2/dist/purify.min.js"></script>
+
+    <script>
+      // Connect to the server using socket.io
+      const socket = io.connect(window.location.protocol + "//" + document.domain + ":" + location.port);
+    </script>
+
+
+    <!-- Link to the favicon -->
+    <link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}">
+
+    <style>
+    /* Basic styling for the chat application */
+    html, body {
+        height: 100%;
+        margin: 0;
+        padding: 0;
+        font-family: Arial, sans-serif;
+        background-color: #f7f7f7;
+        display: grid;
+        place-items: center;
+    }
+    
+    /* Styling for the chat container */
+    #chat-container {
+        display: grid;
+        grid-template-rows: 1fr auto;
+        width: 100%;
+        height: 90vh;
+        background-color: #ffffff;
+        border-radius: 5px;
+        padding: 15px;
+        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
+        box-sizing: border-box;
+    }
+    
+    /* Styling for the chat area */
+    #chat {
+        overflow-y: auto;
+        border: 1px solid #e1e1e1;
+        border-radius: 5px;
+        padding: 10px;
+        margin-bottom: 10px;
+        min-width: 400px;
+    }
+    
+    /* Styling for the message input area */
+    #message, .message-edit {
+        width: 100%;
+        border: 1px solid #e1e1e1;
+        border-radius: 5px;
+        padding: 5px;
+        display: block;
+    }
+
+    /* Styling for the message div holding html/markdown content  */
+    .message-content {
+        width: 100%;
+    }
+
+    /* Styling for individual message wrappers */
+    .message-wrapper {
+        display: flex;
+        align-items: start;
+    }
+    
+    /* Styling for the delete and edit buttons next to messages */
+    .message-wrapper button {
+        margin-top: 16px;
+        margin-right: 8px;
+    }
+
+    /* Styling for paragraphs, used for messages */
+    p {
+        margin-top: 8px;
+        margin-bottom: 8px;
+    }
+
+    /* Styling for the main container that holds the rooms list and chat */
+    .main-container {
+        display: grid;
+        grid-template-columns: 20% 80%; /* Adjust the 20% as needed */
+        width: 100%;
+        height: 90vh;
+    }
+
+    /* Styling for the rooms list */
+    #rooms-list {
+        border-right: 1px solid #e1e1e1;
+        overflow-y: auto;
+    }
+
+    /* Styling for the unordered list in the rooms list */
+    #rooms-list ul {
+        list-style: none; /* Removes default list styling */
+        padding: 0; /* Resets default padding */
+        margin: 0; /* Resets default margin */
+    }
+
+    /* Styling for list items in the rooms list */
+    #rooms-list li {
+        margin-bottom: 10px; /* Adds space between items */
+        padding: 5px; /* Adds padding inside each item */
+        border: 1px solid #e1e1e1; /* Adds a border around each item */
+        border-radius: 5px; /* Optional: Rounds the corners of the border */
+    }
+
+    /* Styling for links in the rooms list */
+    #rooms-list a {
+        text-decoration: none; /* Optional: Removes underline from links */
+        color: inherit; /* Optional: Ensures link color matches the text color */
+    }
+
+    .hljs {
+        position: relative;
+        padding-left: 46px !important;
+        counter-reset: line;
+    }
+ 
+    .hljs .line-numbers-rows {
+        position: absolute;
+        top: 0;
+        left: 0;
+        width: 3em; /* Adjust the width as needed */
+        letter-spacing: -1px;
+        border-right: 1px solid #ccc; /* Optional: adds a line to separate numbers */
+        text-align: right;
+        margin-top: 14px; /* Align with the code block */
+        color: #999;
+        pointer-events: none;
+    }
+    
+    .hljs .line-numbers-rows span {
+        display: block;
+        counter-increment: line;
+    }
+    
+    .hljs .line-numbers-rows span::before {
+        content: counter(line);
+        display: block;
+        padding-right: 0.8em; /* Adjust the padding as needed */
+    }
+
+   </style>
+</head>
+<body>
+  <a href="https://github.com/russellballestrini/flask-socketio-llm-completions#interacting-with-language-models" target="_blank">🚀 docs for interacting with language models & other commands</a>
+  <!-- Search form -->
+  <div id="search-form" style="width: 90%;">
+      <form action="/search" method="get">
+          <input type="text" id="search-keywords" name="keywords" placeholder="Search for keywords..." style="width: 100%; text-align: center;" value="{{ keywords }}">
+          <input type="hidden" id="username" name="username" value="{{ username }}">
+      </form>
+  </div>
+  <!-- Chatroom list -->
+<div class="main-container">
+  <div id="rooms-list">
+      <ul id="rooms-list-ul">
+          <!-- Loop through rooms and create list items for each room -->
+          {% for room in rooms %}
+          <a href="{{ url_for('chat', room_name=room.name) }}?username={{ username }}">
+          <li data-room-id="{{ room.id }}">
+              <!-- Display the room title if available, otherwise the room name -->
+              <b>{{ room.name }}</b> {% if room.title %}<br />{{ room.title }} {% endif %}
+          </li>
+          </a>
+          {% endfor %}
+      </ul>
+  </div>
+  {% block content %}{% endblock %}
+</div>
+
+  <script>
+      // Function to perform the search
+      function performSearch() {
+          const keywords = document.getElementById("search-keywords").value;
+          const username = document.getElementById("username").value;
+          if (!keywords) {
+              alert("Please enter keywords to search.");
+              return;
+          }
+
+          // Navigate to the search results page with the keywords as a query parameter
+          window.location.href = `/search?keywords=${encodeURIComponent(keywords)}&username=${username}`;
+      }
+
+      // Add event listener for keyword search the "Enter" key
+      document.getElementById("search-keywords").addEventListener("keydown", function(event) {
+          if (event.key === "Enter") {
+              event.preventDefault();
+              performSearch();
+          }
+      });
+  </script>
+</body>
+</html>
diff --git a/templates/chat.html b/templates/chat.html
index 9da7eb6..9e9eced 100644
--- a/templates/chat.html
+++ b/templates/chat.html
@@ -1,182 +1,8 @@
-<!DOCTYPE html>
-<html lang="en">
-<head>
-    <meta charset="UTF-8">
-    <meta name="viewport" content="width=device-width, initial-scale=1.0">
-    <title>Chatroom</title>
+{% extends "base.html" %}
 
-    <!-- Include highlight.js library for syntax highlighting -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/highlight.min.js"></script>
-    <!-- Include a highlight.js theme (replace 'default' with your preferred theme) -->
-    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/11.6.0/styles/default.min.css">
-
-    <!-- Include socket.io for real-time bidirectional event-based communication -->
-    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/4.0.1/socket.io.min.js"></script>
-    <!-- Include marked.js for markdown parsing -->
-    <script 
-      src="https://cdnjs.cloudflare.com/ajax/libs/marked/9.1.2/marked.min.js" 
-      integrity="sha512-rfX4p3RNnxdwLT3wWP1K0NR3ztTobn+sISlT9WhxDDK00zNYbQ6MCHA5OHm0hqKAzEMXYCgFrp8iY/ER5MkXqA==" 
-      crossorigin="anonymous" 
-      referrerpolicy="no-referrer">
-    </script>
-
-    <!-- Include DOMPurify to sanitize HTML and prevent XSS attacks -->
-    <script src="https://cdn.jsdelivr.net/npm/dompurify@2/dist/purify.min.js"></script>
-
-    <!-- Link to the favicon -->
-    <link rel="icon" href="{{ url_for('static', filename='favicon.ico') }}">
-
-    <style>
-    /* Basic styling for the chat application */
-    html, body {
-        height: 100%;
-        margin: 0;
-        padding: 0;
-        font-family: Arial, sans-serif;
-        background-color: #f7f7f7;
-        display: grid;
-        place-items: center;
-    }
-    
-    /* Styling for the chat container */
-    #chat-container {
-        display: grid;
-        grid-template-rows: 1fr auto;
-        width: 100%;
-        height: 90vh;
-        background-color: #ffffff;
-        border-radius: 5px;
-        padding: 15px;
-        box-shadow: 0 2px 6px rgba(0, 0, 0, 0.1);
-        box-sizing: border-box;
-    }
-    
-    /* Styling for the chat area */
-    #chat {
-        overflow-y: auto;
-        border: 1px solid #e1e1e1;
-        border-radius: 5px;
-        padding: 10px;
-        margin-bottom: 10px;
-        min-width: 400px;
-    }
-    
-    /* Styling for the message input area */
-    #message, .message-edit {
-        width: 100%;
-        border: 1px solid #e1e1e1;
-        border-radius: 5px;
-        padding: 5px;
-        display: block;
-    }
-
-    /* Styling for the message div holding html/markdown content  */
-    .message-content {
-        width: 100%;
-    }
-
-    /* Styling for individual message wrappers */
-    .message-wrapper {
-        display: flex;
-        align-items: start;
-    }
-    
-    /* Styling for the delete and edit buttons next to messages */
-    .message-wrapper button {
-        margin-top: 16px;
-        margin-right: 8px;
-    }
-
-    /* Styling for paragraphs, used for messages */
-    p {
-        margin-top: 8px;
-        margin-bottom: 8px;
-    }
-
-    /* Styling for the main container that holds the rooms list and chat */
-    .main-container {
-        display: grid;
-        grid-template-columns: 20% 80%; /* Adjust the 20% as needed */
-        width: 100%;
-        height: 90vh;
-    }
-
-    /* Styling for the rooms list */
-    #rooms-list {
-        border-right: 1px solid #e1e1e1;
-        overflow-y: auto;
-    }
-
-    /* Styling for the unordered list in the rooms list */
-    #rooms-list ul {
-        list-style: none; /* Removes default list styling */
-        padding: 0; /* Resets default padding */
-        margin: 0; /* Resets default margin */
-    }
-
-    /* Styling for list items in the rooms list */
-    #rooms-list li {
-        margin-bottom: 10px; /* Adds space between items */
-        padding: 5px; /* Adds padding inside each item */
-        border: 1px solid #e1e1e1; /* Adds a border around each item */
-        border-radius: 5px; /* Optional: Rounds the corners of the border */
-    }
-
-    /* Styling for links in the rooms list */
-    #rooms-list a {
-        text-decoration: none; /* Optional: Removes underline from links */
-        color: inherit; /* Optional: Ensures link color matches the text color */
-    }
-
-    .hljs {
-        position: relative;
-        padding-left: 46px !important;
-        counter-reset: line;
-    }
- 
-    .hljs .line-numbers-rows {
-        position: absolute;
-        top: 0;
-        left: 0;
-        width: 3em; /* Adjust the width as needed */
-        letter-spacing: -1px;
-        border-right: 1px solid #ccc; /* Optional: adds a line to separate numbers */
-        text-align: right;
-        margin-top: 14px; /* Align with the code block */
-        color: #999;
-        pointer-events: none;
-    }
-    
-    .hljs .line-numbers-rows span {
-        display: block;
-        counter-increment: line;
-    }
-    
-    .hljs .line-numbers-rows span::before {
-        content: counter(line);
-        display: block;
-        padding-right: 0.8em; /* Adjust the padding as needed */
-    }
-
-   </style>
-</head>
-<body>
-  <a href="https://github.com/russellballestrini/flask-socketio-llm-completions#interacting-with-language-models" target="_blank">🚀 docs for interacting with language models & other commands</a>
-  <div class="main-container">
-    <div id="rooms-list">
-        <ul>
-            <!-- Loop through rooms and create list items for each room -->
-            {% for room in rooms %}
-            <a href="{{ url_for('chat', room_name=room.name) }}?username={{ username }}">
-            <li data-room-id="{{ room.id }}">
-                <!-- Display the room title if available, otherwise the room name -->
-                <b>{{ room.name }}</b> {% if room.title %}<br />{{ room.title }} {% endif %}
-            </li>
-            </a>
-            {% endfor %}
-        </ul>
-    </div>
+{% block title %}Chatroom{% endblock %}
 
+{% block content %}
     <div id="chat-container">
         <!-- Chat area where messages will be displayed -->
         <div id="chat"></div>
@@ -186,12 +12,7 @@
         </form>
     </div>
 
-  </div>
-
 <script>
-// Connect to the server using socket.io with dynamic scheme (http or https)
-const socket = io.connect(window.location.protocol + "//" + document.domain + ":" + location.port);
-
 // Retrieve username and room name from the URL parameters
 const urlParams = new URLSearchParams(window.location.search);
 const username = urlParams.get("username");
@@ -657,7 +478,5 @@ function addLineNumbers(block) {
     }
     block.appendChild(lineNumbersWrapper);
 }
-
-   </script>
-</body>
-</html>
+</script>
+{% endblock %}
diff --git a/templates/search.html b/templates/search.html
new file mode 100644
index 0000000..36db29b
--- /dev/null
+++ b/templates/search.html
@@ -0,0 +1,40 @@
+{% extends "base.html" %}
+
+{% block title %}Search Results{% endblock %}
+
+{% block content %}
+<style>
+    /* Add styles for the search results */
+    #search-results {
+        margin: 20px;
+        width: 100%;
+    }
+    .search-result {
+        border: 1px solid #e1e1e1;
+        border-radius: 5px;
+        padding: 10px;
+        margin-bottom: 10px;
+        width: 100%;
+    }
+</style>
+
+<div id="search-results">
+    {% if error %}
+        <div class="search-result">{{ error }}</div>
+    {% elif results %}
+        {% for result in results %}
+            <div class="search-result">
+                <a href="/chat/{{ result.room_name }}?username={{ username }}">
+                    <b>{{ result.room_name }}</b><br/>
+                    {{ result.room_title or "No title" }}</br>
+                    <b>Score:</b> {{ result.score }}
+                </a>
+            </div>
+            <br/>
+        {% endfor %}
+    {% else %}
+        <div class="search-result">No results found.</div>
+    {% endif %}
+</div>
+{% endblock %}
+