Shadcn.io is not affiliated with official shadcn/ui
Search Button
A React search input with labeled button combining text and icon using secondary variant built with shadcn/ui InputGroup components
Icon-only search buttons confuse first-time users. This React input group adds a Search button with both text label and SearchIcon using secondary variant and small size. Built with shadcn/ui InputGroup with inline-end alignment and pr-2 padding for visual balance, it's perfect for search forms, filter interfaces, data exploration tools, or any interface where explicit search action helps users understand when results will update versus live filtering.
Search Button preview
Installation
Related Components
Copy Button
Input with icon-only copy button
Multiple Action Buttons
Input with multiple button controls
Password Toggle
Input with visibility toggle button
Search with Icon
Search input with icon addon only
Search Form
Form with search and filter fields
Standard Input
Basic input without buttons
FAQ
Was this page helpful?
Sign in to leave feedback.
Password Actions
A React password input with visibility toggle and generate buttons using Eye icons and RefreshCw built with shadcn/ui InputGroup components
Textarea with Actions
A React textarea with submit button positioned at bottom-right using block-end alignment and ml-auto built with shadcn/ui InputGroup