diff --git a/src/web/index.html b/src/web/index.html
new file mode 100644
index 0000000..de1eef5
--- /dev/null
+++ b/src/web/index.html
@@ -0,0 +1,37 @@
+<!DOCTYPE html>
+<html>
+<head>
+	<meta http-equiv="content-type" content="text/html; charset=utf-8">
+	<meta name="viewport" content="width=device-width, initial-scale=1.0">
+	<link crossorigin rel="stylesheet" href="https://cdn.alemi.dev/web/alemi.css">
+	<title>mmp</title>
+</head>
+<body>
+	<div class="container">
+		<h1>mmp</h1>
+		<p><input type="range" min="0" max="255" value="0" class="w-100" id="ctrl-1"></p>
+		<hr/>
+		<p><input type="range" min="0" max="255" value="0" class="w-100" id="ctrl-2"></p>
+		<hr/>
+		<p><input type="range" min="0" max="255" value="0" class="w-100" id="ctrl-3"></p>
+		<hr/>
+		<p><input type="range" min="0" max="255" value="0" class="w-100" id="ctrl-4"></p>
+		<hr/>
+		<p><input type="range" min="0" max="255" value="0" class="w-100" id="ctrl-5"></p>
+	</div>
+	<script>
+		let socket = new WebSocket("wss://api.alemi.dev/mmp");
+		socket.addEventListener("message", (event) => console.warn("unexpected websocket message", event));
+		for (let i = 0; i < 5; i++) {
+			let inpt = document.getElementById("ctrl-" + (i+1));
+			inpt.addEventListener("input", (ev) => {
+				socket.send(JSON.stringify([i, parseInt(ev.target.value)]));
+			});
+		}
+	</script>
+</body>
+
+</html>
+
+
+
