Accordion Card 2 - Card with Raised Item

Pro

Accordion where closed items sit flat on a muted fill and the open item lifts onto the background with a border and shadow.
Shadcn Accordion Card 2 component

Component data

ID
accordion/accordion-card-2
Access
pro
Created
Oct 30, 2026
Type
example
Libraries
Radix UI, Base UI, React Aria

Accordion Card 2 component design & features

Closed items are flat muted panels. Opening one swaps it to the page background with a border and a medium shadow, and the circular indicator fills in.

The raised state makes the active answer stand out in settings pages and pricing FAQs without adding extra colour.