diff --git a/web/package.json b/web/package.json
index 12267282f..105b9ba31 100644
--- a/web/package.json
+++ b/web/package.json
@@ -86,9 +86,11 @@
 		"@tanstack/svelte-virtual": "^3.13.35",
 		"ansi_up": "^6.0.6",
 		"boneyard-js": "1.9.0",
+		"lucide": "^1.37.0",
 		"markdown-it": "^14.3.0",
 		"markdown-it-anchor": "^9.2.1",
 		"markdown-it-emoji": "^3.1.0",
+		"morphicons": "^1.7.1",
 		"sanitize-html": "^2.17.6",
 		"tailwind-merge": "^3.6.0",
 		"tailwind-variants": "^3.2.2"
diff --git a/web/pnpm-lock.yaml b/web/pnpm-lock.yaml
index 5a37080ef..69d12720f 100644
--- a/web/pnpm-lock.yaml
+++ b/web/pnpm-lock.yaml
@@ -56,6 +56,9 @@ importers:
       boneyard-js:
         specifier: 1.9.0
         version: 1.9.0(patch_hash=e9bda6b0720bed34eefee605bd041784ac2849ae4d27120d9815663d342f694f)(react@19.2.8)(svelte@5.56.9(@typescript-eslint/types@8.64.0))(vite@8.1.4(@types/node@24.13.3)(esbuild@0.28.1)(jiti@2.7.0)(yaml@2.9.0))
+      lucide:
+        specifier: ^1.37.0
+        version: 1.37.0
       markdown-it:
         specifier: ^14.3.0
         version: 14.3.0
@@ -65,6 +68,9 @@ importers:
       markdown-it-emoji:
         specifier: ^3.1.0
         version: 3.1.0
+      morphicons:
+        specifier: ^1.7.1
+        version: 1.7.1(react@19.2.8)(svelte@5.56.9(@typescript-eslint/types@8.64.0))
       sanitize-html:
         specifier: ^2.17.6
         version: 2.17.6
@@ -2768,6 +2774,9 @@ packages:
   lru_map@0.4.1:
     resolution: {integrity: sha512-I+lBvqMMFfqaV8CJCISjI3wbjmwVu/VyOoU7+qtu9d7ioW5klMgsTTiUOUp+DJvfTTzKXoPbyC6YfgkNcyPSOg==}
 
+  lucide@1.37.0:
+    resolution: {integrity: sha512-e6/YmVKk0dwJf1CVDlYfSZTLax/+a7tVPPo867aUC+VmWsGNMimWrFI/pGoDc9qkjiJqkVHar14rMwgOHMrTcw==}
+
   lz-string@1.5.0:
     resolution: {integrity: sha512-h5bgJWpxJNswbU7qCrV0tIKQCaS3blPDrqKWx+QxzuzL1zGUzij9XCWLrSLsJPu5t+eWA/ycetzYAO5IOMcWAQ==}
     hasBin: true
@@ -2837,6 +2846,26 @@ packages:
   mlly@1.8.2:
     resolution: {integrity: sha512-d+ObxMQFmbt10sretNDytwt85VrbkhhUA/JBGm1MPaWJ65Cl4wOgLaB1NYvJSZ0Ef03MMEU/0xpPMXUIQ29UfA==}
 
+  morphicons@1.7.1:
+    resolution: {integrity: sha512-q5ylxy5/d7vBg0OAzanlooXf05PekovMYDuuQVpr6vAQZxl99lrJbaIi+jJ32PXQf9WEEaDO2pbNBsx1ZhEnFQ==}
+    peerDependencies:
+      react: '>=18'
+      react-native: '>=0.71'
+      react-native-svg: '>=14'
+      svelte: '>=5'
+      vue: '>=3.3'
+    peerDependenciesMeta:
+      react:
+        optional: true
+      react-native:
+        optional: true
+      react-native-svg:
+        optional: true
+      svelte:
+        optional: true
+      vue:
+        optional: true
+
   mri@1.2.0:
     resolution: {integrity: sha512-tzzskb3bG8LvYGFF/mDTpq3jpI6Q9wc3LEmBaghu+DdCssd1FakN7Bc0hVNmEyGq1bq3RgfkCb3cmQLpNPOroA==}
     engines: {node: '>=4'}
@@ -5932,6 +5961,8 @@ snapshots:
 
   lru_map@0.4.1: {}
 
+  lucide@1.37.0: {}
+
   lz-string@1.5.0: {}
 
   magic-string@0.30.21:
@@ -6024,6 +6055,11 @@ snapshots:
       pkg-types: 1.3.1
       ufo: 1.6.4
 
+  morphicons@1.7.1(react@19.2.8)(svelte@5.56.9(@typescript-eslint/types@8.64.0)):
+    optionalDependencies:
+      react: 19.2.8
+      svelte: 5.56.9(@typescript-eslint/types@8.64.0)
+
   mri@1.2.0: {}
 
   mrmime@2.0.1: {}
diff --git a/web/src/lib/components/ui/MorphIcon.svelte b/web/src/lib/components/ui/MorphIcon.svelte
new file mode 100644
index 000000000..87ce4c6a4
--- /dev/null
+++ b/web/src/lib/components/ui/MorphIcon.svelte
@@ -0,0 +1,18 @@
+<script lang="ts">
+	// the only file that imports morphicons. it is a young package, so keeping the
+	// whole third-party surface behind one wrapper means swapping it later is one
+	// file, not a sweep across every morph in the app.
+	import { MorphIcon as Morph, type IconInput, type MorphIconProps } from "morphicons/svelte";
+
+	interface Props {
+		icon: IconInput;
+		spring?: MorphIconProps["spring"];
+		/** names the icon for screen readers; without it the svg is decorative */
+		label?: string;
+		class?: string;
+	}
+
+	let { icon, spring = "snappy", label, class: className }: Props = $props();
+</script>
+
+<Morph {icon} {spring} {label} class={className} reducedMotion="user" strokeWidth={2} />