Controls

Rubber Band Select

Drag-select where the marquee is an elastic band — it bows behind fast movement, items pop as it overtakes them, and on release it snaps tight around the selection.

All components

Q3-report.pdf

notes.md

alerts.json

deploy.sh

audit.log

invoice.pdf

team.csv

layout.fig

Drag on the background to select

Installation

ProRequires a Planes Pro license.

npx shadcn add @useplanes/rubber-band-select

Unlock with Planes Pro

$99 once · 54 Pro components · lifetime updates.

I have a license Get Pro

<RubberBandSelect
  items={[
    { id: "a", label: "Q3-report.pdf", icon: <FileText /> },
    { id: "b", label: "logo.svg", icon: <Image /> },
  ]}
  onSelectionChange={(ids) => setSelected(ids)}
/>

Use cases

File managers
Desktop-grade multi-select for web file browsers.
Photo libraries
Sweep up a batch of shots for an album or export.
Dashboard bulk actions
Select rows or cards for tagging and archiving.
Design canvases
Marquee selection that feels elastic instead of clinical.