diff --git a/README.md b/README.md
index 2d5fb7a7..312f38b0 100644
--- a/README.md
+++ b/README.md
@@ -9,7 +9,7 @@
-
Tunneled Mesh Reverse Proxy Server with Access Control
+Tunneled Reverse Proxy Server with Access Control
_Your own self-hosted zero trust tunnel._
diff --git a/public/logo/pangolin_black.svg b/public/logo/pangolin_black.svg
index fd2b02ac..89f5a622 100644
--- a/public/logo/pangolin_black.svg
+++ b/public/logo/pangolin_black.svg
@@ -1,22 +1,21 @@
+
+
+ inkscape:document-units="mm"
+ showgrid="false" />
+
+
+
+
+
diff --git a/public/logo/pangolin_orange.svg b/public/logo/pangolin_orange.svg
index a8823c9d..5e81a57f 100644
--- a/public/logo/pangolin_orange.svg
+++ b/public/logo/pangolin_orange.svg
@@ -1,39 +1,22 @@
+
+
+ xmlns:svg="http://www.w3.org/2000/svg">
+
+
+
+
+
diff --git a/public/logo/pangolin_orange_192x192.png b/public/logo/pangolin_orange_192x192.png
index 52e8659b..33fbf7b0 100644
Binary files a/public/logo/pangolin_orange_192x192.png and b/public/logo/pangolin_orange_192x192.png differ
diff --git a/public/logo/pangolin_orange_512x512.png b/public/logo/pangolin_orange_512x512.png
index 21f27644..ceed7e55 100644
Binary files a/public/logo/pangolin_orange_512x512.png and b/public/logo/pangolin_orange_512x512.png differ
diff --git a/public/logo/pangolin_orange_96x96.png b/public/logo/pangolin_orange_96x96.png
index 6d3821c2..76f23b9d 100644
Binary files a/public/logo/pangolin_orange_96x96.png and b/public/logo/pangolin_orange_96x96.png differ
diff --git a/public/logo/pangolin_profile_picture.png b/public/logo/pangolin_profile_picture.png
new file mode 100644
index 00000000..20c5f72b
Binary files /dev/null and b/public/logo/pangolin_profile_picture.png differ
diff --git a/public/logo/word_mark.png b/public/logo/word_mark.png
index d75a047c..27944d9c 100644
Binary files a/public/logo/word_mark.png and b/public/logo/word_mark.png differ
diff --git a/public/logo/word_mark_black.png b/public/logo/word_mark_black.png
new file mode 100644
index 00000000..ba6fb84e
Binary files /dev/null and b/public/logo/word_mark_black.png differ
diff --git a/public/logo/word_mark_white.png b/public/logo/word_mark_white.png
new file mode 100644
index 00000000..fb7a252d
Binary files /dev/null and b/public/logo/word_mark_white.png differ
diff --git a/src/app/auth/login/DashboardLoginForm.tsx b/src/app/auth/login/DashboardLoginForm.tsx
index b15dd518..0691b343 100644
--- a/src/app/auth/login/DashboardLoginForm.tsx
+++ b/src/app/auth/login/DashboardLoginForm.tsx
@@ -45,8 +45,8 @@ export default function DashboardLoginForm({
diff --git a/src/app/favicon.ico b/src/app/favicon.ico
index 0ffb1c54..1e7b36cd 100644
Binary files a/src/app/favicon.ico and b/src/app/favicon.ico differ
diff --git a/src/components/Layout.tsx b/src/components/Layout.tsx
index e0925525..d8078f58 100644
--- a/src/components/Layout.tsx
+++ b/src/components/Layout.tsx
@@ -1,6 +1,6 @@
"use client";
-import React, { useState } from "react";
+import React, { useEffect, useState } from "react";
import { SidebarNav } from "@app/components/SidebarNav";
import { OrgSelector } from "@app/components/OrgSelector";
import { cn } from "@app/lib/cn";
@@ -23,6 +23,7 @@ import Link from "next/link";
import { usePathname } from "next/navigation";
import { useUserContext } from "@app/hooks/useUserContext";
import { useLicenseStatusContext } from "@app/hooks/useLicenseStatusContext";
+import { useTheme } from "next-themes";
interface LayoutProps {
children: React.ReactNode;
@@ -61,6 +62,30 @@ export function Layout({
const { user } = useUserContext();
const { isUnlocked } = useLicenseStatusContext();
+ const { theme } = useTheme();
+ const [path, setPath] = useState
(""); // Default logo path
+
+ useEffect(() => {
+ function getPath() {
+ let lightOrDark = theme;
+
+ if (theme === "system" || !theme) {
+ lightOrDark = window.matchMedia("(prefers-color-scheme: dark)")
+ .matches
+ ? "dark"
+ : "light";
+ }
+
+ if (lightOrDark === "light") {
+ return "/logo/word_mark_black.png";
+ }
+
+ return "/logo/word_mark_white.png";
+ }
+
+ setPath(getPath());
+ }, [theme, env]);
+
return (
{/* Full width header */}
@@ -139,12 +164,14 @@ export function Layout({
href="/"
className="flex items-center hidden md:block"
>
-
+ {path && (
+
+ )}
{showBreadcrumbs && (