diff --git a/components/ascii/FontPreview.tsx b/components/ascii/FontPreview.tsx
index 584b405..a2fbeae 100644
--- a/components/ascii/FontPreview.tsx
+++ b/components/ascii/FontPreview.tsx
@@ -13,7 +13,7 @@ import {
   MessageSquareCode,
   Type,
 } from 'lucide-react';
-import { cn, actionBtn } from '@/lib/utils';
+import { cn, actionBtn, cardBtn } from '@/lib/utils';
 import { toast } from 'sonner';
 
 export type CommentStyle = 'none' | '//' | '#' | '--' | ';' | '/* */' | '<!-- -->' | '"""';
@@ -133,20 +133,20 @@ export function FontPreview({
         </div>
         <div className="flex items-center gap-1.5 flex-wrap">
           {onCopy && (
-            <button onClick={onCopy} className={actionBtn}>
+            <button onClick={onCopy} className={cardBtn}>
               <Copy className="w-3 h-3" /> Copy
             </button>
           )}
           {onShare && (
-            <button onClick={onShare} className={actionBtn}>
+            <button onClick={onShare} className={cardBtn}>
               <Share2 className="w-3 h-3" /> Share
             </button>
           )}
-          <button onClick={handleExportPNG} className={actionBtn}>
+          <button onClick={handleExportPNG} className={cardBtn}>
             <ImageIcon className="w-3 h-3" /> PNG
           </button>
           {onDownload && (
-            <button onClick={onDownload} className={actionBtn}>
+            <button onClick={onDownload} className={cardBtn}>
               <Download className="w-3 h-3" /> TXT
             </button>
           )}
diff --git a/components/color/ColorManipulation.tsx b/components/color/ColorManipulation.tsx
index b4d5075..aa412cc 100644
--- a/components/color/ColorManipulation.tsx
+++ b/components/color/ColorManipulation.tsx
@@ -10,7 +10,7 @@ import { ExportMenu } from '@/components/color/ExportMenu';
 import { useColorInfo, useGeneratePalette, useGenerateGradient } from '@/lib/color/api/queries';
 import { Loader2, Share2, Plus, X, Palette, Layers } from 'lucide-react';
 import { toast } from 'sonner';
-import { cn, actionBtn } from '@/lib/utils';
+import { cn, actionBtn, cardBtn } from '@/lib/utils';
 import { MobileTabs } from '@/components/ui/mobile-tabs';
 
 type HarmonyType = 'monochromatic' | 'analogous' | 'complementary' | 'triadic' | 'tetradic';
@@ -126,7 +126,7 @@ function ColorManipulationContent() {
               <span className="text-[10px] font-semibold text-muted-foreground uppercase tracking-widest">
                 Color
               </span>
-              <button onClick={handleShare} className={actionBtn}>
+              <button onClick={handleShare} className={cardBtn}>
                 <Share2 className="w-3 h-3" /> Share
               </button>
             </div>
diff --git a/components/media/FileConverter.tsx b/components/media/FileConverter.tsx
index 8db9d40..1dbf5c2 100644
--- a/components/media/FileConverter.tsx
+++ b/components/media/FileConverter.tsx
@@ -17,7 +17,7 @@ import { addToHistory } from '@/lib/media/storage/history';
 import { downloadBlobsAsZip, generateOutputFilename } from '@/lib/media/utils/fileUtils';
 import type { ConversionJob, ConversionFormat, ConversionOptions } from '@/types/media';
 import { ShieldCheck, Download, RotateCcw, Loader2 } from 'lucide-react';
-import { cn, actionBtn } from '@/lib/utils';
+import { cn, actionBtn, cardBtn } from '@/lib/utils';
 
 type MobileTab = 'upload' | 'convert';
 
@@ -470,7 +470,7 @@ export function FileConverter() {
                   Results
                 </span>
                 {completedCount > 0 && (
-                  <button onClick={handleDownloadAll} className={actionBtn}>
+                  <button onClick={handleDownloadAll} className={cardBtn}>
                     <Download className="w-3 h-3" />
                     {completedCount > 1 ? `Download all (${completedCount}) as ZIP` : 'Download'}
                   </button>
diff --git a/components/qrcode/QRPreview.tsx b/components/qrcode/QRPreview.tsx
index 23bc0b0..6ba8b59 100644
--- a/components/qrcode/QRPreview.tsx
+++ b/components/qrcode/QRPreview.tsx
@@ -1,7 +1,7 @@
 'use client';
 
 import { Copy, Share2, Image as ImageIcon, FileCode, QrCode } from 'lucide-react';
-import { cn, actionBtn } from '@/lib/utils';
+import { cn, actionBtn, cardBtn } from '@/lib/utils';
 import type { ExportSize } from '@/types/qrcode';
 
 interface QRPreviewProps {
@@ -42,11 +42,11 @@ export function QRPreview({
           Preview
         </span>
 
-        <button onClick={onCopyImage} disabled={!svgString} className={actionBtn}>
+        <button onClick={onCopyImage} disabled={!svgString} className={cardBtn}>
           <Copy className="w-3 h-3" />Copy
         </button>
 
-        <button onClick={onShare} disabled={!svgString} className={actionBtn}>
+        <button onClick={onShare} disabled={!svgString} className={cardBtn}>
           <Share2 className="w-3 h-3" />Share
         </button>
 
@@ -77,7 +77,7 @@ export function QRPreview({
           </div>
         </div>
 
-        <button onClick={onDownloadSvg} disabled={!svgString} className={actionBtn}>
+        <button onClick={onDownloadSvg} disabled={!svgString} className={cardBtn}>
           <FileCode className="w-3 h-3" />SVG
         </button>
       </div>
diff --git a/lib/utils/styles.ts b/lib/utils/styles.ts
index 8d902d4..00fb2de 100644
--- a/lib/utils/styles.ts
+++ b/lib/utils/styles.ts
@@ -2,6 +2,10 @@
  * Shared Tailwind class strings for consistent UI patterns across tools.
  */
 
+/** Smaller button for card title rows (copy, share, export icons next to a section label) */
+export const cardBtn =
+  'flex items-center gap-1 px-2 py-1 text-[10px] font-mono glass rounded-md border border-border/30 text-muted-foreground hover:text-primary hover:border-primary/30 hover:bg-primary/10 transition-all disabled:opacity-40 disabled:cursor-not-allowed';
+
 /** Standard action button used throughout all tools (copy, download, share, apply…) */
 export const actionBtn =
   'flex items-center gap-1.5 px-3 py-1.5 text-xs font-mono glass rounded-lg border border-border/30 text-muted-foreground hover:text-primary hover:border-primary/30 hover:bg-primary/10 transition-all disabled:opacity-40 disabled:cursor-not-allowed';