diff --git a/frontend/src/lib/components/HistoryList.svelte b/frontend/src/lib/components/HistoryList.svelte
index e9b987e..f975b29 100644
--- a/frontend/src/lib/components/HistoryList.svelte
+++ b/frontend/src/lib/components/HistoryList.svelte
@@ -2,6 +2,7 @@
     import { fileUrl } from '$lib/api/client';
     import { chapterLabel } from '$lib/api/chapters';
     import type { ReadProgressSummary } from '$lib/api/read_progress';
+    import IconButton from '$lib/components/IconButton.svelte';
     import BookImage from '@lucide/svelte/icons/book-image';
     import Trash2 from '@lucide/svelte/icons/trash-2';
 
@@ -112,16 +113,15 @@
                     <span class="when">Read {formatDate(p.updated_at)}</span>
                 </div>
                 {#if onClear}
-                    <button
-                        type="button"
-                        class="icon-btn danger"
+                    <IconButton
+                        variant="danger"
                         onclick={() => clear(p)}
                         aria-label={`Clear ${p.manga_title} from history`}
                         title="Clear from history"
                         data-testid="{testid}-clear-{p.manga_id}"
                     >
                         <Trash2 size={16} aria-hidden="true" />
-                    </button>
+                    </IconButton>
                 {/if}
             </li>
         {/each}
@@ -208,23 +208,4 @@
         padding: var(--space-2) var(--space-3);
         margin: 0 0 var(--space-2);
     }
-
-    .icon-btn {
-        display: inline-flex;
-        align-items: center;
-        justify-content: center;
-        width: 32px;
-        height: 32px;
-        padding: 0;
-        background: transparent;
-        color: var(--text-muted);
-        border: 1px solid transparent;
-        border-radius: var(--radius-sm);
-        cursor: pointer;
-    }
-
-    .icon-btn.danger:hover {
-        color: var(--danger);
-        background: var(--surface-elevated);
-    }
 </style>
diff --git a/frontend/src/routes/library/+page.svelte b/frontend/src/routes/library/+page.svelte
index 09af536..5d26e0d 100644
--- a/frontend/src/routes/library/+page.svelte
+++ b/frontend/src/routes/library/+page.svelte
@@ -95,12 +95,7 @@
         initialDistinct={data.distinctPageTags}
     />
 {:else}
-    <HistoryList
-        entries={data.history}
-        onClear={clearOne}
-        emptyText="Nothing here yet — open any manga and a row will land here once you turn a page."
-        testid="library-history"
-    />
+    <HistoryList entries={data.history} onClear={clearOne} testid="library-history" />
 {/if}
 
 <style>
diff --git a/frontend/src/routes/profile/history/+page.svelte b/frontend/src/routes/profile/history/+page.svelte
index 247ffe4..0e2195d 100644
--- a/frontend/src/routes/profile/history/+page.svelte
+++ b/frontend/src/routes/profile/history/+page.svelte
@@ -33,12 +33,7 @@
             <Eye size={18} aria-hidden="true" />
             <span>Reading history</span>
         </h2>
-        <HistoryList
-            entries={data.progress}
-            onClear={clearOne}
-            emptyText="Nothing here yet — open any manga and a row will land here once you turn a page."
-            testid="history-reading"
-        />
+        <HistoryList entries={data.progress} onClear={clearOne} testid="history-reading" />
     </section>
 
     <section aria-labelledby="uploads-heading" class="uploads-section">