Command Palette

Search for a command to run...

Resizable

Resizable panel groups for building layouts with adjustable panes. Built on react-resizable-panels.

One
Two

Installation

npx shadcn add resizable --registry https://ui.ch.sh/r

Usage

import {
  ResizablePanelGroup,
  ResizablePanel,
  ResizableHandle,
} from "@/components/ui/resizable"

export default function Example() {
  return (
    <ResizablePanelGroup orientation="horizontal">
      <ResizablePanel>Panel 1</ResizablePanel>
      <ResizableHandle />
      <ResizablePanel>Panel 2</ResizablePanel>
    </ResizablePanelGroup>
  )
}