diff --git a/components/figlet/FontSelector.tsx b/components/figlet/FontSelector.tsx
index 604de0f..52c1623 100644
--- a/components/figlet/FontSelector.tsx
+++ b/components/figlet/FontSelector.tsx
@@ -128,31 +128,31 @@ export function FontSelector({
           <button
             onClick={() => setFilter('all')}
             className={cn(
-              'flex-1 px-3 py-1.5 text-xs font-medium rounded-md transition-colors',
+              'flex-1 flex items-center justify-center px-3 py-1.5 text-xs font-medium rounded-md transition-colors',
               filter === 'all' ? 'bg-background shadow-sm' : 'hover:bg-background/50'
             )}
           >
-            <List className="inline-block h-3 w-3 mr-1" />
+            <List className="h-3 w-3 mr-1.5" />
             All
           </button>
           <button
             onClick={() => setFilter('favorites')}
             className={cn(
-              'flex-1 px-3 py-1.5 text-xs font-medium rounded-md transition-colors',
+              'flex-1 flex items-center justify-center px-3 py-1.5 text-xs font-medium rounded-md transition-colors',
               filter === 'favorites' ? 'bg-background shadow-sm' : 'hover:bg-background/50'
             )}
           >
-            <Heart className="inline-block h-3 w-3 mr-1" />
+            <Heart className="h-3 w-3 mr-1.5" />
             Favorites
           </button>
           <button
             onClick={() => setFilter('recent')}
             className={cn(
-              'flex-1 px-3 py-1.5 text-xs font-medium rounded-md transition-colors',
+              'flex-1 flex items-center justify-center px-3 py-1.5 text-xs font-medium rounded-md transition-colors',
               filter === 'recent' ? 'bg-background shadow-sm' : 'hover:bg-background/50'
             )}
           >
-            <Clock className="inline-block h-3 w-3 mr-1" />
+            <Clock className="h-3 w-3 mr-1.5" />
             Recent
           </button>
         </div>