diff --git a/web/matrix_widget.html b/web/matrix_widget.html
new file mode 100644
index 0000000..1754ecf
--- /dev/null
+++ b/web/matrix_widget.html
@@ -0,0 +1,35 @@
+<html>
+<head>
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<link rel="stylesheet" href="https://cdn.alemi.dev/web/alemi.css">
+	<title>mumble stats</title>
+</head>
+<body>
+	<div class="container">
+		<h3 id="loading">loading...</h3>
+		<p><table id="stats" class="w-100 align"></table></p>
+	</div>
+</body>
+<script>
+
+let loading = document.getElementById("loading");
+let stats = document.getElementById("stats");
+async function pingServer() {
+	try {
+		let res = await fetch("https://api.fantabos.co/mumble/ping")
+		let doc = await res.json()
+		stats.innerHTML = `<tr>
+			<td><code>users</code> ${doc.users}/${doc.max_users}</td>
+			<td><code>bandwidth</code> ${doc.bandwidth/1000}kbps</td>
+			<td><code>time</code> ${doc.time}</td>
+		</tr>`;
+		loading.remove();
+	} catch (e) {
+		loading.innerHTML = `error reaching api: ${e}`;
+	}
+}
+pingServer()
+setInterval(pingServer, 1000 * 60);
+
+</script>
+</html>
