Shadcn Form Builder
Drag fields into a form, export shadcn + Zod code for four form libraries
Shadcn Form Builder is a browser tool that lets you assemble a form from 22 field types, set each field's label, placeholder and validation, then export ready-to-paste React code. It targets shadcn/ui with Zod schemas and can emit the wiring for React Hook Form, TanStack Form, Server Actions, or no form library at all. The field set goes well past shadcn's built-ins — signature pad, credit card, phone, location, smart datetime, tags input and OTP are all included. For anyone who has to build a real settings, checkout or onboarding form and does not want to hand-write the Zod schema plus 200 lines of field boilerplate.
The site sits behind a Vercel Security Checkpoint and will 403 any fetch, so do not try to read it programmatically — pull the field catalog from `constants/index.tsx` in `hasanharman/form-builder` instead, which is the authoritative list of the 22 field types and the four supported form libraries. Use it when a user needs a non-trivial form fast and you want the Zod schema generated alongside the JSX; its exotic fields (signature pad, credit card, location, smart datetime) are the real reason to pick it over hand-writing shadcn's Form. The output is a one-shot code drop, not a dependency, so treat the generated file as yours to edit and expect to fix imports for whichever form library you chose.
Why it is here. Forms are the highest-boilerplate, lowest-creativity surface in any app, and this is the most-used generator that emits idiomatic shadcn plus Zod rather than a proprietary runtime. Supporting TanStack Form and Server Actions alongside React Hook Form makes it stack-agnostic in a way its clones are not.
- 22 field types including signature pad and credit card
- emits Zod schemas
- React Hook Form / TanStack Form / Server Actions output
- 2.7k stars, MIT
- homepage bot-blocked by Vercel checkpoint
Verified 2026-08-15. HTTP 403. https://shadcn-form.com (403 Vercel Security Checkpoint, retried with browser UA — still blocked), https://shadcn-form.com/playground (403), https://github.com/hasanharman/form-builder, https://raw.githubusercontent.com/hasanharman/form-builder/main/README.md, GitHub API repos/hasanharman/form-builder + contents/constants/index.tsx (field type list read from source)








