diff --git a/.github/workflows/deploy-demo.yml b/.github/workflows/deploy-demo.yml
new file mode 100644
index 00000000..d209dae3
--- /dev/null
+++ b/.github/workflows/deploy-demo.yml
@@ -0,0 +1,63 @@
+name: Deploy Demo to GitHub Pages
+
+on:
+  push:
+    branches:
+      - main
+  workflow_dispatch:
+
+# Least-privilege permissions
+permissions:
+  contents: read
+  pages: write
+  id-token: write
+
+# Allow only one concurrent deployment, skipping runs queued between the run
+# in-progress and latest queued. Do not cancel in-progress runs.
+concurrency:
+  group: pages
+  cancel-in-progress: false
+
+jobs:
+  build:
+    runs-on: ubuntu-latest
+    steps:
+      - name: Checkout code
+        uses: actions/checkout@34e114876b0b11c390a56381ad16ebd13914f8d5 # v4
+
+      - name: Setup Node.js
+        uses: actions/setup-node@49933ea5288caeca8642d1e84afbd3f7d6820020 # v4
+        with:
+          node-version: '20'
+          cache: 'npm'
+
+      - name: Install dependencies
+        run: npm ci
+
+      - name: Build
+        run: npm run build
+
+      - name: Assemble site
+        run: |
+          mkdir -p _site
+          cp demo/live_demo.html _site/index.html
+          cp dist/ulabel.min.js _site/ulabel.min.js
+
+      - name: Configure Pages
+        uses: actions/configure-pages@983d7736d9b0ae728b81ab479565c72886d7745b # v5
+
+      - name: Upload Pages artifact
+        uses: actions/upload-pages-artifact@56afc609e74202658d3ffba0e8f6dda462b719fa # v3
+        with:
+          path: _site
+
+  deploy:
+    needs: build
+    runs-on: ubuntu-latest
+    environment:
+      name: github-pages
+      url: ${{ steps.deployment.outputs.page_url }}
+    steps:
+      - name: Deploy to GitHub Pages
+        id: deployment
+        uses: actions/deploy-pages@d6db90164ac5ed86f2b6aed7e0febac5b3c0c03e # v4
diff --git a/README.md b/README.md
index b611f4c5..5264ce5c 100644
--- a/README.md
+++ b/README.md
@@ -4,7 +4,7 @@ A browser-based tool for annotating images.
 
 [Demo Gif](https://ulabel.s3.us-east-2.amazonaws.com/output.gif)
 
-[Interactive Demo](https://ulabel.s3.us-east-2.amazonaws.com/live_demo.html)
+[Interactive Demo](https://senterallc.github.io/ulabel/)
 
 ## Usage
 
diff --git a/demo.js b/demo.js
index 431e4063..c4e5dc0a 100644
--- a/demo.js
+++ b/demo.js
@@ -12,4 +12,5 @@ console.log(`http://localhost:${port}/multi-class.html`);
 console.log(`http://localhost:${port}/frames.html`);
 console.log(`http://localhost:${port}/box-roi.html`);
 console.log(`http://localhost:${port}/resume-from.html`);
-console.log(`http://localhost:${port}/row-filtering-example.html`);
\ No newline at end of file
+console.log(`http://localhost:${port}/row-filtering-example.html`);
+console.log(`http://localhost:${port}/live_demo.html`);
\ No newline at end of file
diff --git a/demo/live_demo.html b/demo/live_demo.html
new file mode 100644
index 00000000..5f5aa3a4
--- /dev/null
+++ b/demo/live_demo.html
@@ -0,0 +1,92 @@
+<!DOCTYPE html>
+<html>
+    <head>
+        <title>ULabel Interactive Demo</title>
+
+        <!-- ULabel Library (minified build, served alongside this page) -->
+        <script src="./ulabel.min.js"></script>
+
+        <!-- JQuery Library -->
+        <script src="https://code.jquery.com/jquery-3.5.1.min.js" integrity="sha256-9/aliU8dGd2tb6OSsuzixeV4y/faTqgFtohetphbbj0=" crossorigin="anonymous"></script>
+
+        <!-- ULabel Usage -->
+        <script>
+            /* global $ */
+            /* global ULabel */
+
+            $(window).on("load", function() {
+
+                let resume_from = [
+                    {
+                        "id": "a1035bf8-324d-44c9-9119-7c0c1888d3ba",
+                        "spatial_type": "bbox",
+                        "spatial_payload": [[871.84, 480.78], [833.71, 396.29]],
+                        "classification_payloads": [
+                            {"class_id": 11, "confidence": 1.0},
+                        ],
+                    },
+                    {
+                        "id": "dec78d65-9cb4-43ec-8c5a-dcbbae7a3d74",
+                        "spatial_type": "bbox",
+                        "spatial_payload": [[1257.66, 541.35], [1079.71, 411.99]],
+                        "classification_payloads": [
+                            {"class_id": 10, "confidence": 1.0},
+                        ],
+                    },
+                ];
+
+                function on_submit(annotations) {
+                    var element = document.createElement('a');
+                    element.setAttribute(
+                        "href", ('data:text/plain;charset=utf-8,' +
+                        encodeURIComponent(JSON.stringify(annotations, null, 2)))
+                    );
+                    element.setAttribute("download", "annotations.json");
+                    element.style.display = 'none';
+                    document.body.appendChild(element);
+                    element.click();
+                    document.body.removeChild(element);
+                }
+
+                let subtasks = {
+                    "car_detection": {
+                        "display_name": "Object Detection",
+                        "classes": [
+                            {
+                                "name": "Car",
+                                "color": "orange",
+                                "id": 10
+                            },
+                            {
+                                "name": "Pedestrian",
+                                "color": "cyan",
+                                "id": 11
+                            }
+                        ],
+                        "allowed_modes": ["point", "bbox", "polygon", "contour", "polyline", "tbar", "delete_bbox", "delete_polygon"],
+                        "resume_from": resume_from,
+                        "task_meta": null,
+                        "annotation_meta": null
+                    }
+                };
+
+                // Initial ULabel configuration
+                let ulabel = new ULabel({
+                    "container_id": "container",
+                    "image_data": "https://ulabel.s3.us-east-2.amazonaws.com/cs-demo-0.png",
+                    "username": "DemoUser",
+                    "submit_buttons": on_submit,
+                    "subtasks": subtasks
+                });
+                // Wait for ULabel instance to finish initialization
+                ulabel.init(function() {
+                    // ULabel is now ready for use
+                });
+
+            });
+        </script>
+    </head>
+    <body>
+        <div id="container" style="width: 100%; height: 100vh; position: absolute; top: 0; left: 0;"></div>
+    </body>
+</html>
