diff --git a/packages/site-kit/src/lib/branding/svelte-dark.svg b/packages/site-kit/src/lib/branding/svelte-dark.svg
new file mode 100644
index 0000000000..7ce17ccf45
--- /dev/null
+++ b/packages/site-kit/src/lib/branding/svelte-dark.svg
@@ -0,0 +1 @@
+
diff --git a/packages/site-kit/src/lib/branding/svelte-logo.svg b/packages/site-kit/src/lib/branding/svelte-logo.svg
index 1bd561c1f1..ae7e182a82 100644
--- a/packages/site-kit/src/lib/branding/svelte-logo.svg
+++ b/packages/site-kit/src/lib/branding/svelte-logo.svg
@@ -1,10 +1 @@
-
+
diff --git a/packages/site-kit/src/lib/nav/Nav.svelte b/packages/site-kit/src/lib/nav/Nav.svelte
index b3cb289233..9dae2f2010 100644
--- a/packages/site-kit/src/lib/nav/Nav.svelte
+++ b/packages/site-kit/src/lib/nav/Nav.svelte
@@ -207,6 +207,10 @@ Top navigation bar for the application. It provides a slot for the left side, th
background: url(../branding/svelte.svg) no-repeat var(--sk-page-padding-side) 50% /
calc(100% - var(--sk-page-padding-side) - var(--padding-right)) auto;
padding: 0 var(--padding-right) 0 calc(var(--sk-page-padding-side) + 0rem);
+
+ :global(.dark) & {
+ background-image: url(../branding/svelte-dark.svg);
+ }
}
.mobile-menu {