A powerful form builder application built with TanStack technologies. Create dynamic, type-safe forms with drag-and-drop interface, real-time preview, and automatic code generation.
Intuitive drag-and-drop interface for building forms quickly. Add, rearrange, and configure form fields with ease.
Generate fully typed React components with TypeScript support. Automatic schema generation for form validation.
Seamlessly integrated with ShadCN UI components. Generate customizable, accessible form components out of the box.
Create complex multi-step forms and dynamic field arrays. Perfect for advanced form requirements and data structures.
Save your form configurations, share them with team members, and export generated code for immediate use in your projects.
See your form changes instantly with live preview. Test form behavior and styling as you build.
- Clone the repository:
git clone <repository-url>
cd tanstack-form-builder- Install dependencies:
bun install- Start the development server:
bun run dev:webThe application will be available at http://localhost:3001
- Navigate to the Form Builder section to start creating forms
- Use the drag-and-drop interface to add and arrange form fields
- Configure validation rules and field properties
- Preview your form in real-time
- Export the generated code for use in your projects
This project was started as a fork of formcn.dev and is inspired by:
- tweekcn - Component library and design system
- formcn - Form building tools and utilities
- originui - UI component library and design patterns
- better-t-stack - modern CLI tool for scaffolding end-to-end type-safe TypeScript projects
- Frontend: React 19, TypeScript
- Routing: TanStack Router
- Forms: TanStack Form, React Hook Form
- UI: ShadCN UI, Radix UI, Tailwind CSS
- Validation: Zod, Valibot, ArkType
- Build: Vite, Turbo
- Deployment: Cloudflare Pages
This project is licensed under the MIT License - see the LICENSE file for details.