diff --git a/package/share/ahriman/build-status.jinja2 b/package/share/ahriman/build-status.jinja2
index 3c56f070..e06d8269 100644
--- a/package/share/ahriman/build-status.jinja2
+++ b/package/share/ahriman/build-status.jinja2
@@ -26,12 +26,36 @@
                 100% { background-color: rgba(var(--color-building), 0.0); }
             }
 
-            table, th, td {
+            div.root {
+                width: 70%;
+                padding: 15px 15% 0;
+            }
+
+            section.element {
+                width: 100%;
+            }
+
+            input, table {
+                width: inherit;
+                padding: 10px 0;
+            }
+
+            th, td {
                 padding: 5px;
             }
-            td.package {
-                font-weight: bolder;
+
+            tr.package:nth-child(odd) {
+                background-color: rgba(255, 255, 255, 1);
             }
+
+            tr.package:nth-child(even) {
+                background-color: rgba(235, 235, 255, 1);
+            }
+
+            tr.header, tr.package:hover {
+                background-color: rgba(200, 200, 255, 1);
+            }
+
             td.package-unknown {
                 background-color: rgba(var(--color-unknown), 1.0);
             }
@@ -55,32 +79,64 @@
         </style>
 
         <script src="https://www.kryogenix.org/code/browser/sorttable/sorttable.js"></script>
+        <script type="text/javascript">
+            function searchInTable() {
+                const input = document.getElementById("search");
+                const filter = input.value.toLowerCase();
+                const table = document.getElementById("builds");
+                const tr = table.getElementsByTagName("tr");
+
+                // from 1 coz of header
+                for (var i = 1; i < tr.length; i++) {
+                    let td = tr[i].getElementsByClassName("include-search");
+                    let display = "none";
+                    for (var j = 0; j < td.length; j++) {
+                        if (td[j].tagName.toLowerCase() === "td") {
+                            if (td[j].innerHTML.toLowerCase().indexOf(filter) > -1) {
+                                display = "";
+                                break;
+                            }
+                        }
+                    }
+                    tr[i].style.display = display;
+                }
+            }
+        </script>
+
     </head>
 
     <body>
-        <h1>ahriman {{ version|e }}</h1>
+        <div class="root">
+            <h1>ahriman {{ version|e }}</h1>
 
-        <table class="sortable" id="builds">
-            <tr>
-                <th>package base</th>
-                <th>packages</th>
-                <th>version</th>
-                <th>architecture</th>
-                <th>timestamp</th>
-                <th>status</th>
-            </tr>
+            <section class="element">
+                <input type="search" id="search" onkeyup="searchInTable()" placeholder="search for package" title="search for package"/>
+            </section>
 
-            {% for package in packages %}
-                <tr>
-                    <td class="package"><a href="{{ package.web_url|e }}" title="{{ package.base|e }}">{{ package.base|e }}</a></td>
-                    <td>{{ package.packages|join("<br>"|safe) }}</td>
-                    <td>{{ package.version|e }}</td>
-                    <td>{{ architecture|e }}</td>
-                    <td>{{ package.timestamp|e }}</td>
-                    <td class="package-{{ package.status|e }}">{{ package.status|e }}</td>
-                </tr>
-            {% endfor %}
-        </table>
+            <section class="element">
+                <table class="sortable" id="builds">
+                    <tr class="header">
+                        <th>package base</th>
+                        <th>packages</th>
+                        <th>version</th>
+                        <th>architecture</th>
+                        <th>last update</th>
+                        <th>status</th>
+                    </tr>
+
+                    {% for package in packages %}
+                        <tr class="package">
+                            <td class="package include-search"><a href="{{ package.web_url|e }}" title="{{ package.base|e }}">{{ package.base|e }}</a></td>
+                            <td class="include-search">{{ package.packages|join("<br>"|safe) }}</td>
+                            <td>{{ package.version|e }}</td>
+                            <td>{{ architecture|e }}</td>
+                            <td>{{ package.timestamp|e }}</td>
+                            <td class="package-{{ package.status|e }}">{{ package.status|e }}</td>
+                        </tr>
+                    {% endfor %}
+                </table>
+            </section>
+        </div>
     </body>
 
 </html>
