Skip to Content
DocsLayoutResizable

Resizable

Resizable panels allow users to adjust the size of adjacent sections by dragging a handle.

One
Two

Vertical

Top
Bottom

Component props

ResizablePanelGroup

NameTypeDescription
directionstring"horizontal" | "vertical" (default: "horizontal")

ResizablePanel

NameTypeDescription
defaultSizenumberInitial size as a percentage
minSizenumberMinimum size as a percentage
maxSizenumberMaximum size as a percentage
collapsiblebooleanAllows the panel to collapse below its minimum size

ResizableHandle

NameTypeDescription
withHandlebooleanShows a visible grip on the handle