Vivid API

Side Drawer

A side panel that slides in from the edge of the screen to display additional content or navigation options.

This component was tested and signed off by Applause (external accessibility specialists).

Best Practices

When the side drawer is opened (via a button in the content) focus should automatically move to the first focusable element inside the side-drawer content area.

Resources