diff --git a/src/lib/components/Layout/Header.svelte b/src/lib/components/Layout/Header.svelte
index 6d83dc5..a921e79 100644
--- a/src/lib/components/Layout/Header.svelte
+++ b/src/lib/components/Layout/Header.svelte
@@ -1,8 +1,7 @@
 <script lang="ts">
 	import SearchBar from '../SearchBar.svelte';
 	import SyncIndicator from '../SyncIndicator.svelte';
-	import Menu from 'lucide-svelte/icons/menu';
-	import Search from 'lucide-svelte/icons/search';
+	import Icon from '@iconify/svelte';
 
 	interface Props {
 		onMenuToggle: () => void;
@@ -24,7 +23,7 @@
 			class="rounded-sm p-2 hover:bg-[var(--border)]/10"
 			aria-label="Toggle sidebar"
 		>
-			<Menu class="h-6 w-6 text-[var(--text)]" />
+			<Icon icon="pixelarticons:menu" class="h-6 w-6 text-[var(--text)]" />
 		</button>
 
 		<div class="flex items-center gap-2">
@@ -43,7 +42,7 @@
 			class="ml-auto rounded-sm p-2 hover:bg-[var(--border)]/10 lg:hidden"
 			aria-label="Search"
 		>
-			<Search class="h-5 w-5 text-[var(--text)]" />
+			<Icon icon="pixelarticons:search" class="h-5 w-5 text-[var(--text)]" />
 		</button>
 
 		<div class="flex items-center gap-2">
diff --git a/src/lib/components/Layout/Sidebar.svelte b/src/lib/components/Layout/Sidebar.svelte
index e8e2976..b501fa6 100644
--- a/src/lib/components/Layout/Sidebar.svelte
+++ b/src/lib/components/Layout/Sidebar.svelte
@@ -1,7 +1,7 @@
 <script lang="ts">
 	import { page } from '$app/stores';
 	import { allTags } from '$lib/stores/notes.js';
-	import { StickyNote, Archive, Trash2, Tag, Settings } from 'lucide-svelte';
+	import Icon from '@iconify/svelte';
 
 	interface Props {
 		open: boolean;
@@ -17,9 +17,9 @@
 	}
 
 	const navItems = [
-		{ href: '/', label: 'Crumbs', icon: StickyNote, match: (p: string) => p === '/' },
-		{ href: '/archive', label: 'Archive', icon: Archive, match: (p: string) => p === '/archive' },
-		{ href: '/trash', label: 'Trash', icon: Trash2, match: (p: string) => p === '/trash' }
+		{ href: '/', label: 'Crumbs', icon: 'pixelarticons:sticky-note', match: (p: string) => p === '/' },
+		{ href: '/archive', label: 'Archive', icon: 'pixelarticons:archive', match: (p: string) => p === '/archive' },
+		{ href: '/trash', label: 'Trash', icon: 'pixelarticons:trash', match: (p: string) => p === '/trash' }
 	];
 </script>
 
@@ -44,7 +44,7 @@
 						onclick={closeMobile}
 						class="flex w-full items-center gap-3 rounded-sm px-6 py-3 text-left text-sm transition-colors {item.match($page.url.pathname) ? 'bg-[var(--primary)]/15 text-[var(--primary)]' : 'text-[var(--text)] hover:bg-[var(--bg-base)]'}"
 					>
-						<item.icon size={20} />
+						<Icon icon={item.icon} width={20} />
 						{item.label}
 					</a>
 				</li>
@@ -62,7 +62,7 @@
 								onclick={closeMobile}
 								class="flex w-full items-center gap-3 rounded-sm px-6 py-2 text-left text-sm transition-colors {$page.url.pathname === `/tag/${tag}` ? 'bg-[var(--primary)]/15 text-[var(--primary)]' : 'text-[var(--text)] hover:bg-[var(--bg-base)]'}"
 							>
-								<Tag size={16} />
+								<Icon icon="pixelarticons:label" width={16} />
 								#{tag}
 							</a>
 						</li>
@@ -78,7 +78,7 @@
 			onclick={closeMobile}
 			data-testid="settings-link"
 		>
-			<Settings size={20} />
+			<Icon icon="pixelarticons:settings-cog" width={20} />
 			Settings
 		</a>
 	</div>
diff --git a/src/lib/components/NoteCard.svelte b/src/lib/components/NoteCard.svelte
index 3b85249..321b2f3 100644
--- a/src/lib/components/NoteCard.svelte
+++ b/src/lib/components/NoteCard.svelte
@@ -5,12 +5,7 @@
 	import ImageLightbox from './ImageLightbox.svelte';
 	import CollaboratorPopover from './CollaboratorPopover.svelte';
 	import type { Note } from '$lib/types/index.js';
-	import Undo2 from 'lucide-svelte/icons/undo-2';
-	import Trash2 from 'lucide-svelte/icons/trash-2';
-	import Bookmark from 'lucide-svelte/icons/bookmark';
-	import Archive from 'lucide-svelte/icons/archive';
-	import ArchiveRestore from 'lucide-svelte/icons/archive-restore';
-	import UserMinus from 'lucide-svelte/icons/user-minus';
+	import Icon from '@iconify/svelte';
 
 	interface ChecklistItem {
 		text: string;
@@ -114,7 +109,7 @@
 				title="Unfavorite"
 				data-testid="favorite-indicator"
 			>
-				<Bookmark class="h-4 w-4 fill-[var(--primary)]" />
+				<Icon icon="pixelarticons:heart" class="h-4 w-4 fill-[var(--primary)]" />
 			</button>
 		{/if}
 	</div>
@@ -156,7 +151,7 @@
 				title="Restore"
 				data-testid="restore-btn"
 			>
-				<Undo2 class="h-4 w-4" />
+				<Icon icon="pixelarticons:undo" class="h-4 w-4" />
 			</button>
 			<button
 				onclick={stop(() => deleteNote(note.id))}
@@ -164,7 +159,7 @@
 				title="Delete forever"
 				data-testid="delete-forever-btn"
 			>
-				<Trash2 class="h-4 w-4 text-[var(--destructive)]" />
+				<Icon icon="pixelarticons:trash" class="h-4 w-4 text-[var(--destructive)]" />
 			</button>
 		{:else}
 			{#if !note.pinned}
@@ -174,7 +169,7 @@
 					title="Favorite"
 					data-testid="favorite-btn"
 				>
-					<Bookmark class="h-4 w-4" />
+					<Icon icon="pixelarticons:heart" class="h-4 w-4" />
 				</button>
 			{/if}
 			{#if $currentFilter === 'archived'}
@@ -184,7 +179,7 @@
 					title="Unarchive"
 					data-testid="unarchive-btn"
 				>
-					<ArchiveRestore class="h-4 w-4" />
+					<Icon icon="pixelarticons:archive" class="h-4 w-4" />
 				</button>
 			{:else}
 				<button
@@ -193,7 +188,7 @@
 					title="Archive"
 					data-testid="archive-btn"
 				>
-					<Archive class="h-4 w-4" />
+					<Icon icon="pixelarticons:archive" class="h-4 w-4" />
 				</button>
 			{/if}
 			{#if note.isShared && !note.isOwner}
@@ -203,7 +198,7 @@
 					title="Leave note"
 					data-testid="leave-btn"
 				>
-					<UserMinus class="h-4 w-4" />
+					<Icon icon="pixelarticons:user-minus" class="h-4 w-4" />
 				</button>
 			{:else}
 				<button
@@ -212,7 +207,7 @@
 					title="Delete"
 					data-testid="trash-btn"
 				>
-					<Trash2 class="h-4 w-4" />
+					<Icon icon="pixelarticons:trash" class="h-4 w-4" />
 				</button>
 			{/if}
 		{/if}
diff --git a/src/lib/components/NoteEditor.svelte b/src/lib/components/NoteEditor.svelte
index 940ac21..3dd61b0 100644
--- a/src/lib/components/NoteEditor.svelte
+++ b/src/lib/components/NoteEditor.svelte
@@ -13,15 +13,7 @@
 	import { getPreferences } from '$lib/stores/preferences.svelte.js';
 	import type { Editor } from '@tiptap/core';
 	import type { Note, NoteColor, Attachment, Collaborator } from '$lib/types/index.js';
-	import Palette from 'lucide-svelte/icons/palette';
-	import SquareCheck from 'lucide-svelte/icons/square-check';
-	import ImageIcon from 'lucide-svelte/icons/image';
-	import Type from 'lucide-svelte/icons/type';
-	import FileCode from 'lucide-svelte/icons/file-code';
-	import FileText from 'lucide-svelte/icons/file-text';
-	import UserPlus from 'lucide-svelte/icons/user-plus';
-	import Users from 'lucide-svelte/icons/users';
-	import History from 'lucide-svelte/icons/history';
+	import Icon from '@iconify/svelte';
 
 	interface Props {
 		note: Note | null;
@@ -345,7 +337,7 @@
 						title="Background color"
 						data-testid="color-picker-toggle"
 					>
-						<Palette class="h-5 w-5 text-[var(--text-muted)]" />
+						<Icon icon="pixelarticons:colors-swatch" class="h-5 w-5 text-[var(--text-muted)]" />
 					</button>
 					{#if showColorPicker}
 						<div class="absolute left-0 bottom-full z-10 mb-2 w-[calc(100vw-4rem)] max-w-xs rounded-sm border border-[var(--border)] bg-[var(--bg-surface)] p-2">
@@ -362,9 +354,9 @@
 					data-testid="checklist-toggle"
 				>
 					{#if checklistMode}
-						<Type class="h-5 w-5" />
+						<Icon icon="pixelarticons:art-text" class="h-5 w-5" />
 					{:else}
-						<SquareCheck class="h-5 w-5" />
+						<Icon icon="pixelarticons:checkbox-on" class="h-5 w-5" />
 					{/if}
 				</button>
 
@@ -375,7 +367,7 @@
 					title="Image attachments"
 					data-testid="image-toggle"
 				>
-					<ImageIcon class="h-5 w-5 {showImageUpload ? 'text-[var(--primary)]' : ''}" />
+					<Icon icon="pixelarticons:image" class="h-5 w-5 {showImageUpload ? 'text-[var(--primary)]' : ''}" />
 				</button>
 
 				<!-- Raw markdown mode toggle -->
@@ -387,9 +379,9 @@
 					data-testid="markdown-toggle"
 				>
 					{#if rawMarkdownMode}
-						<FileText class="h-5 w-5" />
+						<Icon icon="pixelarticons:file-text" class="h-5 w-5" />
 					{:else}
-						<FileCode class="h-5 w-5" />
+						<Icon icon="pixelarticons:script" class="h-5 w-5" />
 					{/if}
 				</button>
 
@@ -402,14 +394,14 @@
 						data-testid="share-toggle"
 					>
 						{#if isShared}
-							<Users class="h-5 w-5 text-[var(--primary)]" />
+							<Icon icon="pixelarticons:users" class="h-5 w-5 text-[var(--primary)]" />
 						{:else}
-							<UserPlus class="h-5 w-5" />
+							<Icon icon="pixelarticons:user-plus" class="h-5 w-5" />
 						{/if}
 					</button>
 				{:else if isShared}
 					<span class="flex items-center gap-1 rounded-sm p-2 text-[var(--text-muted)]" title="Shared note">
-						<Users class="h-5 w-5" />
+						<Icon icon="pixelarticons:users" class="h-5 w-5" />
 					</span>
 				{/if}
 
@@ -421,7 +413,7 @@
 						title="Version history"
 						data-testid="history-toggle"
 					>
-						<History class="h-5 w-5 {showHistory ? 'text-[var(--primary)]' : ''}" />
+						<Icon icon="pixelarticons:timeline" class="h-5 w-5 {showHistory ? 'text-[var(--primary)]' : ''}" />
 					</button>
 				{/if}
 			</div>
diff --git a/src/lib/components/SearchBar.svelte b/src/lib/components/SearchBar.svelte
index 32c517a..438c32c 100644
--- a/src/lib/components/SearchBar.svelte
+++ b/src/lib/components/SearchBar.svelte
@@ -1,9 +1,7 @@
 <script lang="ts">
 	import { notes, loadNotes, currentFilter } from '$lib/stores/notes.js';
 	import type { Note } from '$lib/types/index.js';
-	import Search from 'lucide-svelte/icons/search';
-	import X from 'lucide-svelte/icons/x';
-	import ArrowLeft from 'lucide-svelte/icons/arrow-left';
+	import Icon from '@iconify/svelte';
 
 	interface Props {
 		onClose?: () => void;
@@ -59,10 +57,10 @@
 	<div class="flex items-center rounded-sm border border-[var(--border-subtle)] bg-[var(--bg-base)] px-4 py-2 focus-within:border-[var(--primary)]">
 		{#if onClose}
 			<button onclick={close} class="mr-2 text-[var(--text-muted)] hover:text-[var(--text)]" aria-label="Back">
-				<ArrowLeft class="h-5 w-5" />
+				<Icon icon="pixelarticons:arrow-left" class="h-5 w-5" />
 			</button>
 		{:else}
-			<Search class="mr-3 h-5 w-5 text-[var(--text-muted)]" />
+			<Icon icon="pixelarticons:search" class="mr-3 h-5 w-5 text-[var(--text-muted)]" />
 		{/if}
 		<input
 			bind:this={inputEl}
@@ -75,7 +73,7 @@
 		/>
 		{#if query}
 			<button onclick={clearSearch} class="ml-2 text-[var(--text-muted)] hover:text-[var(--text)]" aria-label="Clear search">
-				<X class="h-5 w-5" />
+				<Icon icon="pixelarticons:close" class="h-5 w-5" />
 			</button>
 		{/if}
 	</div>