Application Shell 22 - Mail shell with three resizable panes

Pro

A three-pane mail shell with a folder sidebar, a message list and a reading pane separated by a draggable handle.

Shadcn Application Shell 22 block

Component data

ID
application-shell22
Access
pro
Created
Oct 2, 2026
Type
block
Libraries
Radix UI, Base UI, React Aria

Application Shell 22 block design & features

ApplicationShell22 is a mail client shell built with Shadcn UI. The sidebar has an account switcher, a Compose button, folders with unread counts (Inbox, Drafts, Sent, Junk, Trash, Archive) and a Labels group with counts.

The main area is split into two resizable panels. The message list has a heading with All and Unread tabs, a search field and skeleton message rows with an avatar dot, sender, date and preview lines. The reading pane has a toolbar of archive, junk, trash, snooze, reply, reply all and forward actions above a skeleton message.

The panes are separated by a resize handle with a grip, and each has a minimum width so neither collapses completely.

On small screens the sidebar closes off-canvas and only the message list is shown.