diff --git a/trailbase-assets/js/admin/src/components/IndexPage.tsx b/trailbase-assets/js/admin/src/components/IndexPage.tsx
index 9089fca5..cb0f8cca 100644
--- a/trailbase-assets/js/admin/src/components/IndexPage.tsx
+++ b/trailbase-assets/js/admin/src/components/IndexPage.tsx
@@ -64,36 +64,37 @@ type Element = {
   href: string;
 };
 
+const BASE = import.meta.env.BASE_URL;
 const elements = [
   {
     icon: TbDatabase,
     content: "Browse, create or alter your Tables, Indexes, and Views.",
-    href: "table",
+    href: `${BASE}/table`,
   },
   {
     icon: TbEdit,
     content: "Untethered script access letting you execute arbitrary SQL.",
-    href: "editor",
+    href: `${BASE}/editor`,
   },
   {
     icon: TbChartDots3,
     content: "Visualize Database Schema as Entity-Relationship-Diagram",
-    href: "erd",
+    href: `${BASE}/erd`,
   },
   {
     icon: TbUsers,
     content: "Browse and manage your application's user registry.",
-    href: "auth",
+    href: `${BASE}/auth`,
   },
   {
     icon: TbTimeline,
     content: "Access logs for your application",
-    href: "logs",
+    href: `${BASE}/logs`,
   },
   {
     icon: TbSettings,
     content: "Server settings",
-    href: "settings",
+    href: `${BASE}/settings`,
   },
 ] as Element[];
 
@@ -173,12 +174,12 @@ export function IndexPage() {
             <FactCard
               title="Users"
               content={`${fetchResult().numUsers}`}
-              href="auth"
+              href={`${BASE}/auth`}
             />
             <FactCard
               title="Tables & Views"
               content={`${fetchResult().numTables + fetchResult().numViews}`}
-              href="table"
+              href={`${BASE}/table`}
             />
             <FactCard
               title="Size"
diff --git a/trailbase-assets/js/admin/src/components/NavBar.tsx b/trailbase-assets/js/admin/src/components/NavBar.tsx
index 26bb245a..7d342a62 100644
--- a/trailbase-assets/js/admin/src/components/NavBar.tsx
+++ b/trailbase-assets/js/admin/src/components/NavBar.tsx
@@ -19,7 +19,7 @@ import {
 
 import logo from "@/assets/logo_104.webp";
 
-const BASE = "/_/admin";
+const BASE = import.meta.env.BASE_URL;
 const options = [
   [`${BASE}/table/`, TbDatabase, "Table & View Browser"],
   [`${BASE}/editor`, TbEdit, "SQL Editor"],
@@ -58,6 +58,7 @@ export function NavBar(props: { location: Location }) {
                     </div>
                   </a>
                 </TooltipTrigger>
+
                 <TooltipContent>{tooltip}</TooltipContent>
               </Tooltip>
             );