Accordion Rail 1 - Rail

Pro

Accordion with a left border on each item that darkens when the item opens.

Shadcn Accordion Rail 1 component

Component data

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

Accordion Rail 1 component design & features

Every item has a two-pixel left rail in the border colour. The rail switches to the foreground colour on the open item, giving a quiet active marker without backgrounds.

Rails work in documentation sidebars and settings lists that already use left-aligned navigation.