Shadcn.io is not affiliated with official shadcn/ui
Ghost Button
Minimal ghost button that fills with color on hover for React.
Ghost Button preview
Less is more. A transparent button with just a subtle border that fills with your primary color on hover. It's the perfect secondary action—present but not competing with your main CTA. The fill animation is instant and satisfying, making the button feel responsive. Ideal for cancel buttons, secondary actions, toolbars, or anywhere you need buttons that don't shout. Elegant restraint.
Install with AI
If you've connected the shadcn.io MCP server to Claude Code, Cursor, Windsurf, or any MCP-ready AI editor, prompt your agent to install this button for you — no copy-paste, no CLI:
use shadcnio to install the ghost-button button into my projectRelated Components
Outline Fill Button
Fill rises from bottom
Swipe Button
Color swipe fill
Underline Button
Growing underline
Highlight Button
Sliding highlight bar
Stitch Button
Dashed border
Border Trace Button
SVG border draw
FAQ
Was this page helpful?
Sign in to leave feedback.