Repeatable Field Group Form

A form with repeatable field groups where each entry contains multiple related fields using React Hook Form's useFieldArray

Create forms with complex repeatable sections containing multiple fields per row. Ideal for team member lists, product variants, contact information, or any scenario where users need to input structured data sets with multiple attributes per entry.

Repeatable Field Group Form preview

Scroll to load preview

Installation

Install

Pro block

npx shadcn@latest add https://www.shadcn.io/r/form-repeatable-group.json

npx shadcn@latest add https://www.shadcn.io/r/form-repeatable-group.json

pnpm dlx shadcn@latest add https://www.shadcn.io/r/form-repeatable-group.json

bunx shadcn@latest add https://www.shadcn.io/r/form-repeatable-group.json

Array Fields

Dynamic add/remove field array

Nested Objects

Nested object dot notation fields

Sortable Items

Reorderable sortable item list

Two Column

Two-column grid form layout

Grid Layout

Responsive CSS grid form layout

Dynamic Options

Dynamically loaded select options

FAQ

Last updated on March 24, 2026

Was this page helpful?

Form with Read-Only Fields

A form demonstrating read-only field states with visual indicators for non-editable inputs

Required and Optional Fields Form

A form showing the pattern for required versus optional fields with asterisks and labels.

Repeatable Field Group Form