Knockout Bracket

item

Google-style tournament bracket that pages one round at a time: the leftmost round stacks compactly while later rounds center between their feeder matches, with cards, elbow connectors, headers and container height animating to every new layout.

pnpm dlx shadcn@latest add "https://api.catalogs.dev/shadcn/starc007/knockout-bracket.json"

Sign In

Knockout Bracket

item

Google-style tournament bracket that pages one round at a time: the leftmost round stacks compactly while later rounds center between their feeder matches, with cards, elbow connectors, headers and container height animating to every new layout.

pnpm dlx shadcn@latest add "https://api.catalogs.dev/shadcn/starc007/knockout-bracket.json"

@components/motion/knockout-bracket.tsx