All components

Dialog

Modal overlay for confirmations and forms.

Full API on ui.shadcn.com

Default

<Dialog>
  <DialogTrigger render={<Button variant="outline">Open dialog</Button>} />
  <DialogContent>
    <DialogHeader>
      <DialogTitle>Confirm action</DialogTitle>
      <DialogDescription>This will remove the selected items.</DialogDescription>
    </DialogHeader>
    <DialogFooter>
      <DialogClose render={<Button variant="ghost">Cancel</Button>} />
      <DialogClose render={<Button variant="destructive">Remove</Button>} />
    </DialogFooter>
  </DialogContent>
</Dialog>