diff --git a/pkgs/headscale-ui/default.nix b/pkgs/headscale-ui/default.nix
new file mode 100644
index 0000000..36ef18a
--- /dev/null
+++ b/pkgs/headscale-ui/default.nix
@@ -0,0 +1,55 @@
+{
+  lib,
+  buildNpmPackage,
+  fetchFromGitHub,
+  writeText,
+}:
+let
+  version = "2024.02.24-beta1";
+
+  # Got to love those hand crafted, artisinal patches 😁
+  insertVersionPatch = writeText "0001-headscale-ui-insert-version" ''
+    --- a/src/routes/settings.html/+page.svelte
+    +++ b/src/routes/settings.html/+page.svelte
+    @@ -26,7 +26,7 @@
+     		<ThemeSettings />
+     		<div class="p-4" />
+     		<h1 class="text-2xl bold text-primary mb-4">Version</h1>
+    -		<b>insert-version</b>
+    +		<b>${version}</b>
+     		<div class ="p-4"></div>
+    		<DevSettings></DevSettings>
+     	</div>
+  '';
+in
+buildNpmPackage {
+  pname = "headscale-ui";
+  inherit version;
+
+  src = fetchFromGitHub {
+    owner = "gurucomputing";
+    repo = "headscale-ui";
+    rev = version;
+    hash = "sha256-jbyy8W/qAso2yb/hNsmVHiT0mJXInpEIejU+3IB9wJY=";
+  };
+
+  npmDepsHash = "sha256-SHcsTfX2AnHR8fNCE2+JYV33DtZFQOqN7LSoV+fUu5A=";
+
+  npmPackFlags = [ "--ignore-scripts" ];
+  makeCacheWritable = true;
+
+  patches = [ insertVersionPatch ];
+
+  installPhase = ''
+    cp -a build $out
+  '';
+
+  meta = with lib; {
+    description = "A web frontend for the headscale Tailscale-compatible coordination server";
+    homepage = "https://github.com/gurucomputing/headscale-ui";
+    license = licenses.bsd3;
+    maintainers = with maintainers; [ ];
+    mainProgram = "headscale-ui";
+    platforms = platforms.all;
+  };
+}