diff --git a/src/lib/components/Layout/Sidebar.svelte b/src/lib/components/Layout/Sidebar.svelte
index 18f65bc..e8e2976 100644
--- a/src/lib/components/Layout/Sidebar.svelte
+++ b/src/lib/components/Layout/Sidebar.svelte
@@ -6,10 +6,9 @@
 	interface Props {
 		open: boolean;
 		onClose?: () => void;
-		appVersion?: string;
 	}
 
-	let { open, onClose, appVersion }: Props = $props();
+	let { open, onClose }: Props = $props();
 
 	function closeMobile() {
 		if (window.matchMedia('(max-width: 1023px)').matches) {
@@ -75,17 +74,12 @@
 	<div class="absolute bottom-0 left-0 w-full border-t border-[var(--border-subtle)]">
 		<a
 			href="/settings"
-			class="flex w-full items-center gap-3 px-6 py-3 text-sm text-[var(--text-muted)] transition-colors hover:text-[var(--primary)]"
+			class="flex w-full items-center gap-3 rounded-sm px-6 py-3 text-left text-sm transition-colors {$page.url.pathname.startsWith('/settings') ? 'bg-[var(--primary)]/15 text-[var(--primary)]' : 'text-[var(--text)] hover:bg-[var(--bg-base)]'}"
 			onclick={closeMobile}
 			data-testid="settings-link"
 		>
-			<Settings size={16} />
+			<Settings size={20} />
 			Settings
 		</a>
-		{#if appVersion}
-			<div class="border-t border-[var(--border-subtle)] px-6 py-2 text-right text-xs text-[var(--text-muted)]">
-				v{appVersion}
-			</div>
-		{/if}
 	</div>
 </aside>
diff --git a/src/routes/(app)/+layout.svelte b/src/routes/(app)/+layout.svelte
index 9f4a8f3..d2df4b9 100644
--- a/src/routes/(app)/+layout.svelte
+++ b/src/routes/(app)/+layout.svelte
@@ -34,7 +34,7 @@
 
 <div class="flex min-h-screen flex-col bg-[var(--bg-base)] text-[var(--text)]">
 	<Header onMenuToggle={() => (sidebarOpen = !sidebarOpen)} />
-	<Sidebar open={sidebarOpen} onClose={() => (sidebarOpen = false)} appVersion={data.appVersion} />
+	<Sidebar open={sidebarOpen} onClose={() => (sidebarOpen = false)} />
 
 	<main class="flex-1 pt-4 transition-all {sidebarOpen ? 'lg:ml-64' : ''}">
 		<div class="mx-auto max-w-7xl px-4">
diff --git a/src/routes/(app)/settings/+layout.svelte b/src/routes/(app)/settings/+layout.svelte
index 9189284..71bea8e 100644
--- a/src/routes/(app)/settings/+layout.svelte
+++ b/src/routes/(app)/settings/+layout.svelte
@@ -1,6 +1,6 @@
 <script lang="ts">
 	import { page } from '$app/state';
-	import { User, Cpu, ShieldCheck, SlidersHorizontal } from 'lucide-svelte';
+	import { User, Cpu, ShieldCheck, SlidersHorizontal, Info } from 'lucide-svelte';
 
 	let { data, children } = $props();
 	let pathname = $derived(page.url.pathname);
@@ -56,6 +56,15 @@
 						</a>
 					</li>
 				{/if}
+				<li>
+					<a
+						href="/settings/about"
+						class="flex items-center gap-2 rounded-sm px-3 py-2 text-sm whitespace-nowrap transition-colors {pathname === '/settings/about' ? 'bg-[var(--primary)]/15 text-[var(--primary)] font-medium' : 'text-[var(--text)] hover:bg-[var(--bg-base)]'}"
+					>
+						<Info size={16} />
+						About
+					</a>
+				</li>
 			</ul>
 		</nav>
 
diff --git a/src/routes/(app)/settings/about/+page.svelte b/src/routes/(app)/settings/about/+page.svelte
new file mode 100644
index 0000000..eb90d11
--- /dev/null
+++ b/src/routes/(app)/settings/about/+page.svelte
@@ -0,0 +1,81 @@
+<script lang="ts">
+	import { page } from '$app/stores';
+
+	let appVersion = $derived($page.data.appVersion);
+</script>
+
+<div class="space-y-8">
+	<div class="flex items-center gap-3">
+		<h2 class="text-xl font-bold text-[var(--text)]">About Crumbs</h2>
+		<span
+			class="rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-base)] px-2 py-0.5 text-xs font-medium text-[var(--text-muted)]"
+		>
+			v{appVersion}
+		</span>
+	</div>
+
+	<section
+		class="space-y-2 rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-4 shadow-[var(--card-shadow)]"
+	>
+		<h3 class="text-sm font-bold text-[var(--text)]">What is Crumbs?</h3>
+		<p class="text-sm leading-relaxed text-[var(--text-muted)]">
+			Crumbs is a self-hostable note-taking app. Like breadcrumbs left along a trail, Crumbs
+			captures the small scattered thoughts, ideas, and notes you leave behind as you go — so you
+			can always find your way back to them.
+		</p>
+	</section>
+
+	<section
+		class="space-y-2 rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-4 shadow-[var(--card-shadow)]"
+	>
+		<h3 class="text-sm font-bold text-[var(--text)]">Bretzel App Universe</h3>
+		<p class="text-sm leading-relaxed text-[var(--text-muted)]">
+			Crumbs is part of the
+			<a
+				href="https://bretzel.app"
+				target="_blank"
+				rel="noopener noreferrer"
+				class="text-[var(--primary)] underline hover:text-[var(--primary-hover)]">Bretzel</a
+			> family of apps.
+		</p>
+	</section>
+
+	<section
+		class="space-y-2 rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-4 shadow-[var(--card-shadow)]"
+	>
+		<h3 class="text-sm font-bold text-[var(--text)]">Open Source</h3>
+		<p class="text-sm leading-relaxed text-[var(--text-muted)]">
+			Crumbs is licensed under the MIT License. Source code is available on
+			<a
+				href="https://github.com/bretzel-app/crumbs/"
+				target="_blank"
+				rel="noopener noreferrer"
+				class="text-[var(--primary)] underline hover:text-[var(--primary-hover)]">GitHub</a
+			>.
+		</p>
+	</section>
+
+	<section
+		class="space-y-2 rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-4 shadow-[var(--card-shadow)]"
+	>
+		<h3 class="text-sm font-bold text-[var(--text)]">Feedback</h3>
+		<p class="text-sm leading-relaxed text-[var(--text-muted)]">
+			Feedback is welcome! Please open an issue on
+			<a
+				href="https://github.com/bretzel-app/crumbs/issues"
+				target="_blank"
+				rel="noopener noreferrer"
+				class="text-[var(--primary)] underline hover:text-[var(--primary-hover)]">GitHub Issues</a
+			>.
+		</p>
+	</section>
+
+	<section
+		class="space-y-2 rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-surface)] p-4 shadow-[var(--card-shadow)]"
+	>
+		<h3 class="text-sm font-bold text-[var(--text)]">Tech Stack</h3>
+		<p class="text-sm leading-relaxed text-[var(--text-muted)]">
+			Built with SvelteKit, SQLite, and Drizzle ORM. Offline-first PWA with CRDT-based sync.
+		</p>
+	</section>
+</div>