diff --git a/src/pages/SupportersPage.tsx b/src/pages/SupportersPage.tsx
index e257386..1f8bece 100644
--- a/src/pages/SupportersPage.tsx
+++ b/src/pages/SupportersPage.tsx
@@ -213,7 +213,9 @@ function BackerCard({ backer }: { backer: Backer }) {
   const meta = data?.metadata;
   const name = backer.name || meta?.display_name || meta?.name;
   const avatar = backer.logo || meta?.picture;
-  const initial = (name || 'S').trim().charAt(0).toUpperCase();
+  const display = name
+    || (backer.npub ? `${backer.npub.slice(0, 12)}…${backer.npub.slice(-6)}` : t('walletUi.supporters.anonymousBacker'));
+  const initial = display.replace(/[^a-zA-Z0-9]/g, '').charAt(0).toUpperCase() || 'S';
   const href = backer.npub ? `/${backer.npub}` : backer.url;
 
   return (
@@ -233,14 +235,14 @@ function BackerCard({ backer }: { backer: Backer }) {
       <div className="min-w-0">
         {href && backer.npub ? (
           <Link to={href} className="font-bold text-sm text-white hover:text-[#22d3ee] transition-colors">
-            {name || t('walletUi.supporters.anonymousBacker')}
+            {display}
           </Link>
         ) : href ? (
           <a href={href} target="_blank" rel="noopener noreferrer" className="font-bold text-sm text-white hover:text-[#22d3ee] transition-colors">
-            {name || t('walletUi.supporters.anonymousBacker')}
+            {display}
           </a>
         ) : (
-          <p className="font-bold text-sm text-white">{name || t('walletUi.supporters.anonymousBacker')}</p>
+          <p className="font-bold text-sm text-white">{display}</p>
         )}
         {typeof backer.amount === 'number' && (
           <p className="text-xs font-mono mt-0.5 text-[#22d3ee]/80">{backer.amount.toLocaleString()} sats</p>