Shadcn.io is not affiliated with official shadcn/ui
Tabs with Left Plus Trigger
A tab-style accordion with left-aligned plus/minus indicators and visual separation between items for card-like expandable sections
Standard accordions stack tight with connected borders. This React accordion breaks them apart with gap-2 and rounded-lg corners from Tailwind, creating tab-like cards with left-aligned plus/minus toggles from Lucide React. Built with shadcn/ui and Radix UI, each section feels independent—perfect for dashboards, settings panels, or anywhere discrete expandable cards make more sense than connected stacks.
Tabs with Left Plus Trigger preview
Installation
Related Components
Tabs Accordion
Tab-style accordion with chevron indicators
Tabs with Plus Trigger
Same tab style with right-aligned plus/minus
Standard with Left Plus Trigger
Left plus/minus with connected borders
Tabs with Left Chevron
Tab style with left chevron indicators
Card Component
Non-collapsible card layout
Collapsible Card
Single collapsible card component
FAQ
Was this page helpful?
Sign in to leave feedback.
Icon, Subtitle, and Chevron
An accordion combining category icons, subtitle text, and standard chevron indicators for complete information hierarchy with subtle affordance
Tabs
A tab-style accordion with separated card-like sections and default chevron indicators for clean expandable content organization