diff --git a/src/layout/Footer/FooterHost.svelte b/src/layout/Footer/FooterHost.svelte
index 066fbb1..ae8d06f 100644
--- a/src/layout/Footer/FooterHost.svelte
+++ b/src/layout/Footer/FooterHost.svelte
@@ -5,9 +5,10 @@
 	import { queries } from '$data/api';
 	import { friendlyName } from '$util/friendlyName';
 	import { createQuery } from '@tanstack/svelte-query';
-	
+
 	import Query from '$lib/components/Query.svelte';
 	import FooterSection from './FooterSection.svelte';
+	import { page } from '$app/stores';
 
 	const query = createQuery(['repositories'], queries.repositories);
 </script>
@@ -52,6 +53,7 @@
 				<li><a href="/download">Download</a></li>
 				<li><a href="/patches">Patches</a></li>
 				<li><a href="/contributors">Contributors</a></li>
+				<li><a href="{$page.url.toString().split('/')[0]}/docs/">Docs</a></li>
 			</FooterSection>
 			<FooterSection title="Repositories">
 				<Query {query} let:data>
@@ -68,11 +70,20 @@
 				<ul>
 					<!-- to replace -->
 					<li><a href="https://github.com/revanced" target="_blank" rel="noreferrer">GitHub</a></li>
-					<li><a href="https://revanced.app/discord" target="_blank" rel="noreferrer">Discord</a></li>
-					<li><a href="https://reddit.com/r/revancedapp" target="_blank" rel="noreferrer">Reddit</a></li>
+					<li>
+						<a href="https://revanced.app/discord" target="_blank" rel="noreferrer">Discord</a>
+					</li>
+					<li>
+						<a href="https://reddit.com/r/revancedapp" target="_blank" rel="noreferrer">Reddit</a>
+					</li>
 					<li><a href="https://t.me/app_revanced" target="_blank" rel="noreferrer">Telegram</a></li>
-					<li><a href="https://twitter.com/revancedapp" target="_blank" rel="noreferrer">Twitter</a></li>
-					<li><a href="https://www.youtube.com/c/ReVanced" target="_blank" rel="noreferrer">YouTube</a></li>
+					<li>
+						<a href="https://twitter.com/revancedapp" target="_blank" rel="noreferrer">Twitter</a>
+					</li>
+					<li>
+						<a href="https://www.youtube.com/c/ReVanced" target="_blank" rel="noreferrer">YouTube</a
+						>
+					</li>
 				</ul>
 			</FooterSection>
 		</section>
diff --git a/src/layout/Navbar/NavHost.svelte b/src/layout/Navbar/NavHost.svelte
index 9f4c206..2f1dc9c 100644
--- a/src/layout/Navbar/NavHost.svelte
+++ b/src/layout/Navbar/NavHost.svelte
@@ -13,6 +13,7 @@
 	import RouterEvents from '$data/RouterEvents';
 
 	import { useQueryClient } from '@tanstack/svelte-query';
+	import { page } from '$app/stores';
 
 	const client = useQueryClient();
 
@@ -72,6 +73,7 @@
 					<Navigation queryKey="manager" href="/download">Download</Navigation>
 					<Navigation queryKey="patches" href="/patches">Patches</Navigation>
 					<Navigation queryKey="repositories" href="/contributors">Contributors</Navigation>
+					<Navigation href="{$page.url.toString().split('/')[0]}/docs/">Docs</Navigation>
 				</div>
 			</div>
 			<div id="secondary-navigation">
@@ -107,9 +109,7 @@
 		</Svg>
 	</svelte:fragment>
 	<svelte:fragment slot="title">Settings</svelte:fragment>
-	<svelte:fragment slot="description"
-		>Configure the API for this website.</svelte:fragment
-	>
+	<svelte:fragment slot="description">Configure the API for this website.</svelte:fragment>
 	<div id="settings-content">
 		<div class="input-wrapper">
 			<input name="api-url" type="text" bind:value={url} />