diff --git a/assets/css/scene.css b/assets/css/scene.css
new file mode 100644
index 0000000..31a8bb3
--- /dev/null
+++ b/assets/css/scene.css
@@ -0,0 +1,5 @@
+#sceneNavbar {
+  z-index: 99999;
+  position: fixed;
+  width: 100%;
+}
\ No newline at end of file
diff --git a/assets/js/editor.js b/assets/js/editor.js
index e66d606..72dae51 100644
--- a/assets/js/editor.js
+++ b/assets/js/editor.js
@@ -1,7 +1,6 @@
 import { getScene, getSceneElement, getCategory } from "./api";
 import { populateDestinationDropdown } from "./editor/teleport";
 
-import "../scss/frontend.scss";
 import "../css/editor.css";
 
 let clickTimestamp = 0;
diff --git a/assets/js/scene.js b/assets/js/scene.js
index c305984..f6e9629 100644
--- a/assets/js/scene.js
+++ b/assets/js/scene.js
@@ -1,4 +1,8 @@
-import { getScene } from "./api";
+import { getScene, getCategory } from "./api";
+import { Dropdown } from "bootstrap";
+
+import "../scss/frontend.scss";
+import "../css/scene.css";
 
 require("aframe");
 
@@ -16,8 +20,13 @@ class QuackscapeScene extends HTMLElement {
     this.x = this.getAttribute("x") | 0;
     this.y = this.getAttribute("y") | 0;
     this.z = this.getAttribute("z") | 0;
+    this.navbar = this.getAttribute("nonavbar") == undefined;
 
     loadScene(this.scene, this.x, this.y, this.z, this, this.embedded);
+
+    if (this.navbar) {
+      loadNavbar(this.scene, this);
+    }
   }
 }
 
@@ -27,6 +36,67 @@ document.addEventListener("contextmenu", function (event) {
 
 customElements.define("quackscape-scene", QuackscapeScene);
 
+// Function to add a navbar to the destination object
+
+async function loadNavbar(scene_id, destination) {
+  getScene(scene_id).then((scene) => {
+    getCategory(scene.obj.category).then((category) => {
+      var nav = document.createElement("nav");
+      nav.setAttribute("class", "navbar navbar-expand-lg navbar-dark bg-dark");
+      nav.setAttribute("id", "sceneNavbar");
+
+      var container = document.createElement("div");
+      container.setAttribute("class", "container-fluid");
+
+      var dropdown = document.createElement("div");
+      dropdown.setAttribute("class", "dropdown");
+
+      var sceneSelector = document.createElement("button");
+      sceneSelector.setAttribute("class", "btn btn-secondary dropdown-toggle");
+      sceneSelector.setAttribute("type", "button");
+      sceneSelector.setAttribute("id", "sceneSelector");
+      sceneSelector.setAttribute("data-bs-toggle", "dropdown");
+      sceneSelector.setAttribute("aria-expanded", "true");
+      sceneSelector.textContent = "Select Scene";
+
+      var dropdownMenu = document.createElement("ul");
+      dropdownMenu.setAttribute("class", "dropdown-menu show");
+      dropdownMenu.setAttribute("aria-labelledby", "sceneSelector");
+      console.log(dropdownMenu);
+
+      category.obj.scenes.forEach((scene) => {
+        console.log(scene);
+        var sceneLink = document.createElement("a");
+        sceneLink.setAttribute("class", "dropdown-item");
+        sceneLink.setAttribute("href", "#");
+        sceneLink.textContent = scene.title;
+        sceneLink.addEventListener("click", function () {
+          loadScene(scene.id, -1, -1, -1, destination);
+        });
+
+        dropdownMenu.appendChild(sceneLink);
+      });
+
+      var sceneTitle = document.createElement("a");
+      sceneTitle.setAttribute("class", "navbar-brand");
+      sceneTitle.setAttribute("href", "#");
+      sceneTitle.setAttribute("id", "sceneTitle");
+      sceneTitle.textContent = scene.obj.title;
+
+      dropdown.appendChild(sceneSelector);
+      dropdown.appendChild(dropdownMenu);
+      console.log(dropdownMenu);
+
+      container.appendChild(dropdown);
+      container.appendChild(sceneTitle);
+
+      nav.appendChild(container);
+
+      destination.prepend(nav);
+    });
+  });
+}
+
 // Function to load a scene into a destination object
 // x and y signify the initial looking direction, -1 for the scene's default
 
diff --git a/quackscape/tours/templates/tours/scene_edit.html b/quackscape/tours/templates/tours/scene_edit.html
index 8457479..c688aa4 100644
--- a/quackscape/tours/templates/tours/scene_edit.html
+++ b/quackscape/tours/templates/tours/scene_edit.html
@@ -30,6 +30,7 @@
               y="{{ scene.default_y }}"
               z="{{ scene.default_z }}"
               embedded
+              nonavbar
             ></quackscape-scene>
         </div>