Not affiliated with official shadcn/ui. Visit ui.shadcn.com for official docs.
React Collapsible with Icon
A React collapsible with Plus icon and hover underline creating link-style expandable content triggers using shadcn/ui and Lucide React icons
Looking to implement shadcn/ui patterns?
Join our Discord community for help from other developers.
Links reveal content—why not expandables? This React collapsible uses Plus icon from Lucide React with hover:underline creating link-style expandable triggers. Built with shadcn/ui and Radix UI featuring leading Plus icon, gap-2 spacing, and underline affordance on hover. The link aesthetic makes triggers feel lightweight and discoverable—perfect for Show more patterns, expandable footnotes, additional details, supplementary content, or anywhere expandable content should feel like optional exploration rather than prominent interface feature requiring button-style visual weight.
Pattern created by @haydenbleasel
Installation
Related patterns you will also like
Simple Collapsible
Button-based trigger with ghost variant
Inline Trigger Collapsible
ChevronsUpDown FAQ-style layout
Text-only Collapsible
Text expand trigger without icon
FAQ Item
Plus icon with border styling
Link Button
Button styled as link
Card Collapsible
Card-styled expandable
Questions you might have
React Inline Trigger Collapsible
A React inline collapsible with ChevronsUpDown icon and justify-between layout for FAQ-style expandable question-answer sections using shadcn/ui
React Text-only Collapsible
A React text-only collapsible with bracketed expand trigger and heading label creating minimal expandable sections using shadcn/ui without icons or buttons