diff --git a/web/src/app/home/components/home-sidebar/HomeSidebar.tsx b/web/src/app/home/components/home-sidebar/HomeSidebar.tsx
index 60bd93a1..01753556 100644
--- a/web/src/app/home/components/home-sidebar/HomeSidebar.tsx
+++ b/web/src/app/home/components/home-sidebar/HomeSidebar.tsx
@@ -92,7 +92,6 @@ import {
 } from '@/components/ui/popover';
 import { cn } from '@/lib/utils';
 import { useSidebarData, SidebarEntityItem } from './SidebarDataContext';
-import { LayoutDashboard, Puzzle } from 'lucide-react';
 
 // Compare two version strings, returns true if v1 > v2
 function compareVersions(v1: string, v2: string): boolean {
@@ -1057,12 +1056,16 @@ function PluginPagesNav() {
   // Group pages by plugin (author/name)
   const grouped = new Map<
     string,
-    { label: string; pages: typeof pluginPages }
+    { label: string; iconURL: string; pages: typeof pluginPages }
   >();
   for (const page of pluginPages) {
     const key = `${page.pluginAuthor}/${page.pluginName}`;
     if (!grouped.has(key)) {
-      grouped.set(key, { label: page.pluginLabel, pages: [] });
+      grouped.set(key, {
+        label: page.pluginLabel,
+        iconURL: page.pluginIconURL,
+        pages: [],
+      });
     }
     grouped.get(key)!.pages.push(page);
   }
@@ -1075,9 +1078,20 @@ function PluginPagesNav() {
       <SidebarGroupContent>
         <SidebarMenu>
           {Array.from(grouped.entries()).map(
-            ([pluginKey, { label, pages }]) => {
+            ([pluginKey, { label, iconURL, pages }]) => {
               const hasActivePage = pages.some((p) => p.id === currentId);
 
+              const pluginIcon = (
+                <img
+                  src={iconURL}
+                  alt=""
+                  className="size-4 rounded-sm object-cover shrink-0"
+                  onError={(e) => {
+                    (e.target as HTMLImageElement).style.display = 'none';
+                  }}
+                />
+              );
+
               // Single page — render directly without nesting
               if (pages.length === 1) {
                 const page = pages[0];
@@ -1089,8 +1103,9 @@ function PluginPagesNav() {
                       isActive={isActive}
                       tooltip={page.name}
                       onClick={() => navigate(route)}
+                      className="select-none"
                     >
-                      <LayoutDashboard className="size-4 text-blue-500" />
+                      {pluginIcon}
                       <span>{page.name}</span>
                     </SidebarMenuButton>
                   </SidebarMenuItem>
@@ -1106,8 +1121,11 @@ function PluginPagesNav() {
                 >
                   <SidebarMenuItem>
                     <CollapsibleTrigger asChild>
-                      <SidebarMenuButton tooltip={label}>
-                        <Puzzle className="size-4 text-blue-500" />
+                      <SidebarMenuButton
+                        tooltip={label}
+                        className="select-none"
+                      >
+                        {pluginIcon}
                         <span>{label}</span>
                         <ChevronRight className="ml-auto size-4 transition-transform duration-200 group-data-[state=open]/collapsible:rotate-90" />
                       </SidebarMenuButton>
@@ -1122,6 +1140,7 @@ function PluginPagesNav() {
                               <SidebarMenuSubButton
                                 isActive={isActive}
                                 onClick={() => navigate(route)}
+                                className="select-none"
                               >
                                 <span>{page.name}</span>
                               </SidebarMenuSubButton>
diff --git a/web/src/app/home/components/home-sidebar/SidebarDataContext.tsx b/web/src/app/home/components/home-sidebar/SidebarDataContext.tsx
index 95fe10c0..3f734635 100644
--- a/web/src/app/home/components/home-sidebar/SidebarDataContext.tsx
+++ b/web/src/app/home/components/home-sidebar/SidebarDataContext.tsx
@@ -38,9 +38,10 @@ export interface PluginPageItem {
   pluginAuthor: string;
   pluginName: string;
   pluginLabel: string; // human-readable plugin display name
+  pluginIconURL: string; // plugin icon URL
   pageId: string;
   path: string; // asset path (HTML file)
-  icon?: string; // optional icon name
+  icon?: string; // optional per-page icon name from page manifest
 }
 
 // Entity lists and refresh functions exposed via context
@@ -205,6 +206,7 @@ export function SidebarDataProvider({
                 pluginAuthor: author,
                 pluginName: name,
                 pluginLabel: label,
+                pluginIconURL: httpClient.getPluginIconURL(author, name),
                 pageId: page.id,
                 path: page.path,
                 icon: page.icon,