diff --git a/apps/mukke/apps/web/package.json b/apps/mukke/apps/web/package.json
index e1cca77b8..26c8d2da1 100644
--- a/apps/mukke/apps/web/package.json
+++ b/apps/mukke/apps/web/package.json
@@ -36,6 +36,8 @@
 		"@manacore/shared-auth": "workspace:*",
 		"@manacore/shared-auth-ui": "workspace:*",
 		"@manacore/shared-branding": "workspace:*",
+		"@manacore/shared-feedback-service": "workspace:^",
+		"@manacore/shared-feedback-ui": "workspace:^",
 		"@manacore/shared-i18n": "workspace:*",
 		"@manacore/shared-icons": "workspace:*",
 		"@manacore/shared-splitscreen": "workspace:^",
diff --git a/apps/mukke/apps/web/src/lib/services/feedback.ts b/apps/mukke/apps/web/src/lib/services/feedback.ts
new file mode 100644
index 000000000..143ad1ae9
--- /dev/null
+++ b/apps/mukke/apps/web/src/lib/services/feedback.ts
@@ -0,0 +1,18 @@
+import { browser } from '$app/environment';
+import { createFeedbackService } from '@manacore/shared-feedback-service';
+import { authStore } from '$lib/stores/auth.svelte';
+
+function getAuthUrl(): string {
+	if (browser && typeof window !== 'undefined') {
+		const injectedUrl = (window as unknown as { __PUBLIC_MANA_CORE_AUTH_URL__?: string })
+			.__PUBLIC_MANA_CORE_AUTH_URL__;
+		return injectedUrl || 'http://localhost:3001';
+	}
+	return 'http://localhost:3001';
+}
+
+export const feedbackService = createFeedbackService({
+	apiUrl: getAuthUrl(),
+	appId: 'mukke',
+	getAuthToken: async () => authStore.getValidToken(),
+});
diff --git a/apps/mukke/apps/web/src/routes/(app)/+layout.svelte b/apps/mukke/apps/web/src/routes/(app)/+layout.svelte
index a0b8150f3..cbf499632 100644
--- a/apps/mukke/apps/web/src/routes/(app)/+layout.svelte
+++ b/apps/mukke/apps/web/src/routes/(app)/+layout.svelte
@@ -66,6 +66,8 @@
 		{ href: '/projects', label: 'Editor', icon: 'waveform' },
 		{ href: '/upload', label: 'Upload', icon: 'upload' },
 		{ href: '/settings', label: 'Settings', icon: 'settings' },
+		{ href: '/feedback', label: 'Feedback', icon: 'chat' },
+		{ href: '/help', label: 'Help', icon: 'help-circle' },
 	];
 
 	const navItems = $derived(baseNavItems);
diff --git a/apps/mukke/apps/web/src/routes/(app)/feedback/+page.svelte b/apps/mukke/apps/web/src/routes/(app)/feedback/+page.svelte
new file mode 100644
index 000000000..7ff699b5a
--- /dev/null
+++ b/apps/mukke/apps/web/src/routes/(app)/feedback/+page.svelte
@@ -0,0 +1,11 @@
+<script lang="ts">
+	import { FeedbackPage } from '@manacore/shared-feedback-ui';
+	import { feedbackService } from '$lib/services/feedback';
+	import { authStore } from '$lib/stores/auth.svelte';
+</script>
+
+<svelte:head>
+	<title>Feedback - Mukke</title>
+</svelte:head>
+
+<FeedbackPage {feedbackService} appName="Mukke" currentUserId={authStore.user?.id} />
diff --git a/apps/mukke/apps/web/src/routes/(app)/help/+page.svelte b/apps/mukke/apps/web/src/routes/(app)/help/+page.svelte
new file mode 100644
index 000000000..bed75c520
--- /dev/null
+++ b/apps/mukke/apps/web/src/routes/(app)/help/+page.svelte
@@ -0,0 +1,59 @@
+<script lang="ts">
+	import { goto } from '$app/navigation';
+	import { SettingsPage, SettingsSection, SettingsCard, SettingsRow } from '@manacore/shared-ui';
+	import { Question, Keyboard, EnvelopeSimple } from '@manacore/shared-icons';
+</script>
+
+<svelte:head>
+	<title>Help - Mukke</title>
+</svelte:head>
+
+<SettingsPage title="Help & Support" subtitle="Learn how to use Mukke">
+	<SettingsSection title="Getting Started">
+		{#snippet icon()}<Question size={20} />{/snippet}
+		<SettingsCard>
+			<SettingsRow
+				label="Upload Music"
+				description="Drag and drop audio files or click Browse to upload MP3, WAV, FLAC, and more."
+			/>
+			<SettingsRow
+				label="Auto Tag Extraction"
+				description="ID3 tags (title, artist, album, cover art) are automatically extracted from uploaded files."
+			/>
+			<SettingsRow
+				label="Edit Metadata"
+				description="Click the pencil icon on any song in your library to edit metadata. Use 'Write to File' to save tags back to MP3 files."
+			/>
+			<SettingsRow
+				label="Playlists"
+				description="Create playlists to organize your music. Add songs from the library or search."
+			/>
+			<SettingsRow
+				label="Editor Projects"
+				description="Open songs in the editor for waveform visualization, BPM detection, and synced lyrics creation."
+			/>
+		</SettingsCard>
+	</SettingsSection>
+
+	<SettingsSection title="Keyboard Shortcuts">
+		{#snippet icon()}<Keyboard size={20} />{/snippet}
+		<SettingsCard>
+			<SettingsRow
+				label="Ctrl + 1-5"
+				description="Navigate to Library, Playlists, Editor, Upload, Settings"
+			/>
+			<SettingsRow label="Space" description="Play / Pause (in editor)" />
+		</SettingsCard>
+	</SettingsSection>
+
+	<SettingsSection title="Contact">
+		{#snippet icon()}<EnvelopeSimple size={20} />{/snippet}
+		<SettingsCard>
+			<SettingsRow
+				label="Feedback"
+				description="Send us your suggestions and bug reports"
+				href="/feedback"
+			/>
+		</SettingsCard>
+	</SettingsSection>
+</SettingsPage>
diff --git a/apps/mukke/apps/web/src/routes/(app)/settings/+page.svelte b/apps/mukke/apps/web/src/routes/(app)/settings/+page.svelte
new file mode 100644
index 000000000..10d2a3cd0
--- /dev/null
+++ b/apps/mukke/apps/web/src/routes/(app)/settings/+page.svelte
@@ -0,0 +1,63 @@
+<script lang="ts">
+	import { goto } from '$app/navigation';
+	import { authStore } from '$lib/stores/auth.svelte';
+	import {
+		SettingsPage,
+		SettingsSection,
+		SettingsCard,
+		SettingsRow,
+		SettingsDangerZone,
+		SettingsDangerButton,
+	} from '@manacore/shared-ui';
+	import { User, MusicNotes, Info } from '@manacore/shared-icons';
+
+	async function handleLogout() {
+		await authStore.signOut();
+		goto('/login');
+	}
+</script>
+
+<svelte:head>
+	<title>Settings - Mukke</title>
+</svelte:head>
+
+<SettingsPage title="Settings" subtitle="Manage your Mukke preferences">
+	<!-- Account Section -->
+	<SettingsSection title="Account">
+		{#snippet icon()}<User size={20} />{/snippet}
+		<SettingsCard>
+			<SettingsRow label="Email" description={authStore.user?.email || 'Not logged in'} />
+			<SettingsRow label="Theme" description="Customize colors and appearance" href="/themes" />
+		</SettingsCard>
+	</SettingsSection>
+
+	<!-- Library Section -->
+	<SettingsSection title="Library">
+		{#snippet icon()}<MusicNotes size={20} />{/snippet}
+		<SettingsCard>
+			<SettingsRow
+				label="Default Sort"
+				description="How songs are sorted by default in the library"
+			/>
+		</SettingsCard>
+	</SettingsSection>
+
+	<!-- About Section -->
+	<SettingsSection title="About">
+		{#snippet icon()}<Info size={20} />{/snippet}
+		<SettingsCard>
+			<SettingsRow label="Version" description="1.0.0" />
+			<SettingsRow label="Help" description="Get help with Mukke" href="/help" />
+			<SettingsRow label="Feedback" description="Send us your feedback" href="/feedback" />
+		</SettingsCard>
+	</SettingsSection>
+
+	<!-- Danger Zone -->
+	<SettingsDangerZone>
+		<SettingsDangerButton
+			label="Sign Out"
+			description="Sign out of your account"
+			onclick={handleLogout}
+		/>
+	</SettingsDangerZone>
+</SettingsPage>
diff --git a/apps/mukke/apps/web/src/routes/(app)/themes/+page.svelte b/apps/mukke/apps/web/src/routes/(app)/themes/+page.svelte
new file mode 100644
index 000000000..47ed9d251
--- /dev/null
+++ b/apps/mukke/apps/web/src/routes/(app)/themes/+page.svelte
@@ -0,0 +1,19 @@
+<script lang="ts">
+	import { goto } from '$app/navigation';
+	import { ThemePage } from '@manacore/shared-theme-ui';
+	import { theme } from '$lib/stores/theme.svelte';
+</script>
+
+<svelte:head>
+	<title>Themes - Mukke</title>
+</svelte:head>
+
+<ThemePage
+	currentVariant={theme.variant}
+	onSelectTheme={(v) => theme.setVariant(v)}
+	showModeSelector={true}
+	currentMode={theme.mode}
+	onModeChange={(m) => theme.setMode(m)}
+	showBackButton={true}
+	onBack={() => goto('/library')}
+/>