Accordion
A clean, minimal, and modern accordion component featuring smooth Framer Motion animations. Designed for clarity and ease of use, it supports both single and multiple open items and fits perfectly into documentation, FAQs, or content-heavy layouts.
Live Interactive Preview
Future UI is a modern, high-performance UI component library built for Next.js 16 and React 19. It leverages Tailwind CSS 4 and Framer Motion to provide visually stunning, reusable components.
Source
npx futureuikit add accordion Details
Built with Framer Motion for smooth, physics-based height transitions.Supports single or multiple item expansion via the 'allowMultiple' prop.Modern, minimalist design with subtle border treatments and clean typography.Integrated with Lucide React for intuitive directional iconography.Fully responsive and keyboard accessible.Easily customizable via Tailwind CSS classes.
How to Use?
- Import the Accordion component into your page or section.
- Define an array of items, each with a 'title' and 'content'.
- Pass the items to the Accordion component.
- Use the 'allowMultiple' prop if you want users to be able to open more than one item at a time.