diff --git a/src/judas_server/web/templates/client_details.html b/src/judas_server/web/templates/client_details.html
index 0b5c790..db9e58d 100644
--- a/src/judas_server/web/templates/client_details.html
+++ b/src/judas_server/web/templates/client_details.html
@@ -3,7 +3,31 @@
   <head>
     <meta charset="UTF-8" />
     <meta name="viewport" content="width=device-width, initial-scale=1.0" />
-    <title>Details for client {{ client.mac_id }}</title>
+    <title>Details for client {{ client.id }}</title>
+    <link
+      rel="stylesheet"
+      href="{{ url_for('static', filename='css/style.css') }}"
+    />
   </head>
-  <body></body>
+  <body>
+    <h1>Details for client {{ client.id }}</h1>
+    <p><strong>ID:</strong> {{ client.id }}</p>
+    <p><strong>IP Address:</strong> {{ client.addr[0] }}</p>
+    <p><strong>Port:</strong> {{ client.addr[1] }}</p>
+    <p>
+      <strong>Last Seen:</strong>
+      <span id="last-seen">{{ client.last_seen }}</span>
+    </p>
+  </body>
+
+  <script>
+    function updateLastSeen() {
+      const lastSeenElement = document.getElementById("last-seen");
+      const lastSeenTimestamp = parseInt(lastSeenElement.textContent);
+      const lastSeenDate = new Date(lastSeenTimestamp * 1000);
+      lastSeenElement.textContent = lastSeenDate.toLocaleString();
+    }
+
+    updateLastSeen();
+  </script>
 </html>
