diff --git a/.github/workflows/docs.yml b/.github/workflows/docs-latest.yml
similarity index 94%
rename from .github/workflows/docs.yml
rename to .github/workflows/docs-latest.yml
index 42a202c8..8d4f869c 100644
--- a/.github/workflows/docs.yml
+++ b/.github/workflows/docs-latest.yml
@@ -24,4 +24,4 @@ jobs:
           github_token: ${{ secrets.GITHUB_TOKEN }}
           keep_files: true
           publish_dir: ./book
-          destination_dir: ./
+          destination_dir: ./latest
diff --git a/.github/workflows/docs-release.yml b/.github/workflows/docs-release.yml
new file mode 100644
index 00000000..c183d5fe
--- /dev/null
+++ b/.github/workflows/docs-release.yml
@@ -0,0 +1,32 @@
+name: Build docs
+
+on:
+  release:
+    types: [published]
+
+jobs:
+  deploy:
+    runs-on: ubuntu-20.04
+    steps:
+      - uses: actions/checkout@v2
+
+      - name: Get release tag
+        run: echo "RELEASE_VERSION=${GITHUB_REF#refs/*/}" >> $GITHUB_ENV
+
+      - name: Setup mdBook
+        uses: peaceiris/actions-mdbook@v1
+        with:
+          mdbook-version: '0.4.11'
+
+      - name: Set version of docs
+        run: echo 'window.HOOKSHOT_VERSION = "${{ env.RELEASE_VERSION }}";' > ./docs/_site/version.js
+
+      - run: mdbook build
+
+      - name: Deploy latest
+        uses: peaceiris/actions-gh-pages@v3
+        with:
+          github_token: ${{ secrets.GITHUB_TOKEN }}
+          keep_files: true
+          publish_dir: ./book
+          destination_dir: ./${{ env.RELEASE_VERSION }}
diff --git a/book.toml b/book.toml
index 81e9d28c..5b7d49f7 100644
--- a/book.toml
+++ b/book.toml
@@ -22,3 +22,8 @@ git-repository-url = "https://github.com/matrix-org/matrix-hookshot"
 additional-css = [
     "docs/_site/style.css"
 ]
+
+additional-js = [
+    "docs/_site/main.js",
+    "docs/_site/version.js"
+]
\ No newline at end of file
diff --git a/docs/_site/main.js b/docs/_site/main.js
new file mode 100644
index 00000000..0b17658c
--- /dev/null
+++ b/docs/_site/main.js
@@ -0,0 +1,36 @@
+window.addEventListener("load", () => {
+    const scrollbox = document.querySelector(".sidebar-scrollbox");
+    scrollbox.innerHTML = `<div class="version-box"><span>Version: </span></div>${scrollbox.innerHTML}`;
+    const currentVersion = window.HOOKSHOT_VERSION || 'latest';
+
+    const selectElement = document.createElement("select");
+    
+    fetch("https://api.github.com/repos/matrix-org/matrix-hookshot/releases", {
+        cache: "force-cache",
+    }).then(res => 
+        res.json()
+    ).then(releases => {
+        selectElement.innerHTML = "";
+        for (const version of ['latest', ...releases.map(r => r.tag_name).filter(s => s !== "0.1.0")]) {
+            const option = document.createElement("option");
+            option.innerHTML = version;
+            selectElement.add(option);
+            if (currentVersion === version) {
+                option.setAttribute('selected', '');
+            }
+        }
+    }).catch(ex => {
+        console.error("Failed to fetch version data", ex);
+    })
+    
+    const option = document.createElement("option");
+    option.innerHTML = 'loading...';
+    selectElement.add(option);
+
+    selectElement.addEventListener('change', (event) => {
+        const versionlessPath = window.location.pathname.split('/').slice(2).join('/');
+        window.location = `${window.location.origin}/${event.target.value}/${versionlessPath}`;
+    });
+
+    document.querySelector(".version-box").appendChild(selectElement);
+});
\ No newline at end of file
diff --git a/docs/_site/version.js b/docs/_site/version.js
new file mode 100644
index 00000000..ca4ea7f1
--- /dev/null
+++ b/docs/_site/version.js
@@ -0,0 +1,2 @@
+// This is modified by the build script
+window.HOOKSHOT_VERSION = "latest";
\ No newline at end of file