Drag and Drop Form Builder: 18 Tools for Teams and Developers (2026)
The right drag and drop form builder depends on who builds the forms. If your team just needs forms on a website, a hosted no-code form builder such as Jotform, Typeform, Fillout or Tally is the fastest path. If your own users need to design forms inside your product, embed a builder library: Form.io (MIT builder, JSON output) or formBuilder and Formeo (MIT, lighter) are fully open source, while SurveyJS Creator, FormEngine and Vueform Builder are polished but paid. If you want to own the whole app, self-host OpnForm, HeyForm or Formbricks. Below are 18 tools compared on price, license, seats and embedding, with working code for the developer options.
What a drag-and-drop form builder actually is
Every drag-drop form builder, hosted or embedded, has the same shape. On the left is a palette of field types (text, email, dropdown, checkboxes, file upload, signature, payment). In the middle is a canvas where you drop fields and reorder them. On the right is a settings panel for the selected field: label, placeholder, required, validation, and conditional logic ("show this field only if the answer above is Yes"). A preview button shows the form as a respondent sees it.
Under the hood, almost every modern builder stores the form as JSON: a list of components with their settings. A separate renderer turns that JSON into a working HTML form, validates input and hands you the submission. That split matters, because it decides what you can buy or download:
- Hosted no-code form builders (Jotform, Typeform, Fillout, Tally, Formstack, RapidForms) keep both halves on their servers. You get a share link and an embed code, and responses land in their dashboard or your spreadsheet.
- Embeddable builder libraries (Form.io, SurveyJS, FormEngine, formBuilder, Formeo, Vueform Builder) give you the designer and renderer as JavaScript packages, so the builder runs inside your own app and the JSON and submissions live in your database.
- Self-hosted form apps (OpnForm, HeyForm, Formbricks, LimeSurvey) are complete Typeform-style products you deploy on your own server.
Drag and drop forms creation looks the same in all three. The difference is where the data lives, who pays, and how much you can customize.
Best drag-and-drop form builders for teams (no-code)
For a drag and drop web form builder used by marketing, HR, ops or support, the questions are: how many responses you get, how many people can edit forms, whether you can remove branding, and whether SSO or HIPAA is available if you need it. This table compares the entry paid plans, since that is what a team usually buys. (For free-plan limits, see the free form builder comparison.)
| Tool | Entry paid plan | Responses on that plan | Editors | Branding removed | SSO / HIPAA |
|---|---|---|---|---|---|
| Jotform | Bronze, $39/month or $408/year | 1,000/month, 25 forms | Single user (multi-user on Enterprise) | Yes on paid plans | SSO on Enterprise; HIPAA on Gold ($129/month) and Enterprise |
| Typeform | Basic, $39/month ($28/month billed yearly) | 100/month | 1 (Plus: 3, Business: 5) | From Plus ($79/month) | Both on Enterprise |
| Fillout | Starter, $15/month ($180/year) | 2,000/month | Unlimited seats | From Pro ($40/month) | SSO on Enterprise only; HIPAA not mentioned |
| Tally | Pro, €20/month | Unlimited (fair use) | Unlimited team members | Yes | Not listed |
| Formstack | Forms, $83/month paid annually | 1,000 per form, 25 forms | 1 builder user | Not stated | HIPAA as an add-on; SSO on Enterprise |
| RapidForms | Hobby, $32/year | 100/month, 10 forms | Collaboration on Pro ($15/month) | Yes, on every paid plan | Not listed |
Prices as of November 2026, from each vendor's pricing page. Typeform's plan cards and its "Compare all plans" table showed different figures when we checked; the table above uses the plan cards.
Tally Pro and RapidForms Pro are unlimited, so they don't fit the scale. Formstack counts 1,000 per form rather than per month. Source: vendor pricing pages, November 2026
The hosted tools in a sentence each
- Jotform: the broadest feature set (payment integrations, a large template library, and approval workflows through Jotform Approvals), and every paid plan removes Jotform branding. But every plan below Enterprise is single-user, so a team shares one login or pays for Enterprise.
- Typeform: the one-question-at-a-time conversational format. Strong design, but responses are tight on the cheaper plans and branding removal starts at Plus.
- Fillout: unlimited seats on every plan and integrations (Airtable, Notion, Google Sheets, HubSpot, webhooks) on all plans, which makes it good value for teams.
- Tally: a document-style builder that, in Tally's words, works like a text document: you type and insert blocks Notion-style, rather than dragging from a sidebar. The free plan covers most needs; Pro adds custom domains and unlimited team members.
- Formstack: aimed at regulated and enterprise teams, with a HIPAA add-on. Approval routing, document generation and eSignatures are not in the Forms plan; they sit in the higher bundles.
- RapidForms: a simple hosted builder with templates (job applications, event registration, pre-orders, quotes), Google Sheets, payments, conditional logic and embedding on Framer, WordPress and Webflow. Building and previewing is free; publishing needs a paid plan. Disclosure: it is made by DevHunt's founder. It is the cheapest unbranded option here, but it has fewer integrations than Jotform or Fillout.
Easiest drag-and-drop form builder for non-technical teams
For people who have never built a form, pick a tool with templates, a live preview and no field-level jargon. Tally (start typing questions as if writing a document) and Fillout (classic drag-and-drop canvas with templates) are the gentlest. Both show a form exactly as respondents will see it while you edit, and both connect to Google Sheets without code. Jotform has a large template library, but its builder exposes more options, which some first-time users find busy.
Workflow software with drag and drop form builders
If the form is the start of a process (an approval, a contract, a ticket), you want routing, not just a form. Formstack sells approvals and document generation on top of its forms, and Jotform includes approval flows. For lighter needs, every tool in the table sends webhooks or connects to Zapier or Make, so a submission can create a row, a task or a Slack message. If your forms really need to drive records and relations, you may be after a drag and drop database builder (Airtable-style) rather than a form tool; see our no-code and low-code platforms guide.
Open source form builders compared
GitHub stars, licenses and last activity checked in each repository in November 2026. This is the drag and drop form builder open source landscape: embeddable libraries first, then complete self-hosted apps. The best open source form builder to embed is usually Form.io; the best one to self-host as a finished app is OpnForm or HeyForm.
| Project | Type | Drag-and-drop builder license | Stack | Stars | Best for |
|---|---|---|---|---|---|
Form.io (@formio/js 5.7) |
Embeddable library | MIT | Vanilla JS, React/Angular wrappers | ~2.1k | Letting your users design forms inside your app |
| formBuilder (3.23) | Embeddable library | MIT | jQuery | ~2.7k | Simple builders in existing or server-rendered apps |
| Formeo (5.19) | Embeddable library | MIT | Vanilla JS (TypeScript types) | ~600 | A modern, framework-free builder with columns and conditions |
Puck (@puckeditor/core 0.24) |
Embeddable visual editor | MIT | React | ~13.6k | Drag-and-drop editors built from your own React components |
| react-form-builder2 | Embeddable library | MIT | React | ~500 | Small React projects (last release May 2025) |
| Vueform | Form library; Builder is separate | Vueform MIT; Builder white-label is commercial | Vue | ~1.5k | Vue apps |
| SurveyJS | Library | Form Library MIT; Survey Creator is commercial | JS, React/Angular/Vue | ~4.9k (library) | Teams willing to pay for a polished designer |
| FormEngine | Library | Core MIT; drag-and-drop designer is commercial | React | ~250 | Rendering JSON forms in React |
| OpnForm | Self-hosted app | AGPL-3.0 (enterprise folder separate) | Laravel, Nuxt | ~4k | A self-hosted Typeform/Tally replacement |
| HeyForm | Self-hosted app | AGPL-3.0 | TypeScript | ~9.1k | Conversational, one-question-at-a-time forms |
| Formbricks | Self-hosted app | AGPL-3.0 (enterprise folder separate) | Next.js | ~13.2k | Surveys, in-app feedback, NPS |
| LimeSurvey | Self-hosted app | GPL-2.0 or later | PHP | ~3.8k | Long research surveys |
Projects you'll see in older lists: OhMyForm's repository is archived; Formily (alibaba/formily, ~12.6k stars) hasn't been pushed to since June 2025, and its designer (alibaba/designable) hasn't had a commit since April 2025. Typebot, a chat-style form builder, is source-available under the Functional Source License (FSL-1.1-Apache-2.0, where each release becomes Apache 2.0 two years later), not an OSI open source license.
Stars measure popularity, not quality. Formily is included for scale but has had no commits since mid-2025. Source: GitHub repository pages, November 4, 2026
The open-core catch: renderer free, designer paid
Form builders have two parts: the designer (the drag-and-drop canvas that outputs a JSON schema) and the renderer (which turns that schema into a working form). The renderer is the easy part, and many vendors open source only that.
- SurveyJS: the Form Library is MIT, but Survey Creator, the drag-and-drop part, is proprietary. The licensing page says you must buy a developer license for each team member who works on the integration. You may test it before buying.
- FormEngine: FormEngine Core is MIT; the Designer on top is commercial. Its licenses are tied to domains, not developers (FormEngine pricing).
- Vueform: the Vueform library is MIT and the online builder is free, but embedding the builder in your own product under your brand is the White-Label plan (Vueform Builder pricing).
- Form.io: the builder in
@formio/jsis MIT. Form.io's paid product is the hosted and self-hosted enterprise platform (the open source API server,formio/formio, is OSL-3.0).
If you search for a "react form builder drag and drop open-source", check the license of the designer package specifically, not the repo's headline badge. On npm, survey-creator-core and @react-form-builder/designer both point to a custom license file, while their renderers say MIT.
What the paid designers cost
| Designer | Price | Model | Licensed per |
|---|---|---|---|
| SurveyJS Creator | Basic $589 (€499); PRO $1,059 (€899); Enterprise from $2,359 | Perpetual; renewal for updates and support $239/year (Basic) | Developer |
| FormEngine Designer | StartUp $1,299, Business $2,999, Enterprise $5,999; subscription from $899/year | Perpetual with 365 days of updates | Domain (1, 3, unlimited); Enterprise needed for public SaaS |
| Vueform Builder | White-Label $299/month or $3,590/year | Subscription; 50% off the first year for companies under $10k monthly revenue | 1 on-premise integration and 1 builder domain |
| Form.io platform | SaaS $300/month after a 30-day trial; self-hosted from $330/month per project plus $330/month per API server; Enterprise Form Builder Module (embedded) $660/month per 10 tenants | Subscription | Project and environment |
Prices as of November 2026. All of these are fair prices for what they save you, but the gap between "MIT" and "per developer" matters if five engineers touch the form code.
One developer for SurveyJS; one domain for FormEngine; Form.io SaaS at $300 x 12. Models differ (perpetual vs subscription), so treat this as a rough guide. Source: SurveyJS, FormEngine, Vueform and Form.io pricing pages, November 2026
Embed a drag-and-drop form builder with Form.io
Form.io's builder produces a JSON form definition. You save that JSON, then render it anywhere with the same library. This is the pattern for an admin panel where customers build their own intake forms, and the reason Form.io ranks for "form builder" among developers: it is the most complete builder you can embed for free.
Plain HTML
From the formio.js README:
<link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap/dist/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://cdn.form.io/js/formio.full.min.css" />
<script src="https://cdn.form.io/js/formio.full.min.js"></script>
<div id="builder"></div>
<script>
Formio.builder(document.getElementById('builder'), {}, {}).then((builder) => {
// fires with the full form definition whenever a component is added, edited or removed
builder.on('change', (form) => console.log(JSON.stringify(form)));
});
</script>
The default templates use Bootstrap classes, so include Bootstrap CSS or the builder will look broken. Pin versions in production instead of loading the latest from the CDN.
Restrict the palette for your users
End users rarely need every component. The third argument to Formio.builder takes options from the Form.io builder docs: set a sidebar group to false to hide it, list component keys in disabled, and use noDefaultSubmitButton if you add your own submit button.
Formio.builder(document.getElementById('builder'), {}, {
builder: {
resource: false, // "Existing Resource Fields"
advanced: false,
premium: false,
},
noDefaultSubmitButton: true,
}).then((builder) => {
builder.on('addComponent', () => console.log('field added'));
builder.on('removeComponent', () => console.log('field removed'));
});
The builder also fires updateComponent and builderFormValidityChange. To change which settings appear when a user edits a field, override that component's editForm function (Formio.Components.components.textfield.editForm), keeping each setting's key equal to the property name in the component JSON (for example validate.required).
React
Install the React wrapper and core library (formio/react):
npm install @formio/react @formio/js
Then pair the builder with the renderer:
import { useRef, useState } from 'react';
import { FormBuilder, Form } from '@formio/react';
const initialForm = { display: 'form', components: [] };
export default function FormDesigner() {
const latest = useRef(initialForm); // updated on every builder change
const [preview, setPreview] = useState(null);
return (
<>
<FormBuilder form={initialForm} onChange={(form) => { latest.current = form; }} />
<button onClick={() => setPreview(structuredClone(latest.current))}>Preview</button>
{preview && (
<Form src={preview} onSubmit={(submission) => console.log(submission.data)} />
)}
</>
);
}
Keeping the builder's form prop stable avoids re-initializing the builder on every edit. Store latest.current in your database (it's plain JSON) and render it later with <Form src={schema} />. Submissions go to your onSubmit handler, so you don't need the Form.io server unless you want its API.
jQuery: formBuilder
formBuilder is a single call (formbuilder.online docs):
jQuery(($) => {
const fb = $('#fb-editor').formBuilder();
$('#save').on('click', () => {
const json = fb.actions.getData('json', true); // the form definition
console.log(json);
});
});
formBuilder loads asynchronously, so call actions from an event handler (as above) or after its promise resolves, not right after initialization.
Its companion formRender plugin renders the saved definition. It suits server-rendered apps (PHP, Rails, Django templates) that already load jQuery. Version 3.23.2 was published at the end of October 2026, so it is still maintained.
Formeo: no jQuery
Formeo is a newer builder that needs no jQuery. It adds multi-column and inline layouts, conditional fields and TypeScript types. From the Formeo README:
npm install formeo
import { FormeoEditor, FormeoRenderer } from 'formeo';
import 'formeo/dist/formeo.min.css';
// <div id="formeo-editor"></div> in your HTML
const editor = new FormeoEditor({ editorContainer: '#formeo-editor' });
FormeoRenderer renders the saved definition on the respondent side.
Other embeddable builders: SurveyJS and Puck
SurveyJS Creator in React
If you have the budget, SurveyJS Creator is the most polished embeddable designer: themes, logic editor, translations and a JSON editor tab. From the SurveyJS React guide:
npm install survey-creator-react
'use client';
import { useState } from 'react';
import { SurveyCreator, SurveyCreatorComponent } from 'survey-creator-react';
import 'survey-core/survey-core.css';
import 'survey-creator-core/survey-creator-core.css';
export default function SurveyCreatorWidget() {
const [creator] = useState(() => {
const instance = new SurveyCreator({ autoSaveEnabled: true });
instance.saveSurveyFunc = (saveNo: number, callback: (num: number, ok: boolean) => void) => {
// replace with a POST to your API
window.localStorage.setItem('survey-json', instance.text);
callback(saveNo, true);
};
return instance;
});
return (
<div style={{ height: '100vh', width: '100%' }}>
<SurveyCreatorComponent creator={creator} />
</div>
);
}
In Next.js, load it with dynamic(() => import(...), { ssr: false }) to avoid hydration errors. Render saved JSON with the free MIT Form Library (survey-react-ui).
Puck: drag-and-drop from your own components
Puck is a page-and-content editor rather than a form builder, but it is the best MIT option when the blocks users drag must be your own React components (your design system's inputs, for example). The package is now @puckeditor/core; older tutorials use @measured/puck. From the Puck README:
import { Puck, Render } from '@puckeditor/core';
const config = {
components: {
HeadingBlock: {
fields: { children: { type: 'text' } },
render: ({ children }) => <h1>{children}</h1>,
},
},
};
export function Editor({ data, save }) {
return <Puck config={config} data={data} onPublish={save} />;
}
export function Page({ data }) {
return <Render config={config} data={data} />;
}
You would add components such as TextField and Select, then write your own submit handling, which is more work than Form.io but gives total control over the look.
Embedding a builder in your own app: the architecture
Whichever library you pick, a self-hosted enterprise form builder with JSON-based APIs comes down to the same four pieces.
- Store form definitions as versioned JSON. Save a new version on publish rather than overwriting, so old submissions always match the form they were filled against.
- Store submissions against a version. A simple Postgres layout:
create table forms (
id uuid primary key default gen_random_uuid(),
tenant_id uuid not null,
name text not null,
created_at timestamptz not null default now()
);
create table form_versions (
form_id uuid not null references forms(id),
version int not null,
schema jsonb not null, -- the builder's JSON output
published_at timestamptz not null default now(),
primary key (form_id, version)
);
create table submissions (
id uuid primary key default gen_random_uuid(),
form_id uuid not null,
version int not null,
data jsonb not null,
created_at timestamptz not null default now(),
foreign key (form_id, version) references form_versions(form_id, version)
);
- Validate on the server. Client-side validation in the renderer is for user experience; a malicious client can skip it. Re-check required fields, types and lengths on your API before saving. Form.io's open source server (
formio/formio) does this for you if you run it; otherwise validate against the stored schema yourself. - Scope everything by tenant. If customers build forms, every query on
formsandsubmissionsneeds the tenant filter (or row-level security), and file uploads need per-tenant storage paths.
If you don't want an embedded form builder UI at all (your team defines the forms, users only fill them in), skip the designer: write the schema by hand and use a renderer such as react-jsonschema-form (@rjsf/core, Apache-2.0). Our free JSON Schema generator and JSON formatter help when you hand-edit schemas.
Self-host an open source form builder
If you want a Typeform-style app you own, rather than a component:
- OpnForm: a no-code form builder with a Laravel API and Nuxt front end, deployed with Docker (deployment docs). The stack runs Nginx, the Nuxt front end, the Laravel API, a queue worker, a scheduler, PostgreSQL and Redis. Note the limit: as of November 2026, a free self-hosted instance allows 2 users in total; more users and enterprise features need a self-hosted Enterprise license. DevHunt listing: OpnForm.
- HeyForm: conversational forms (surveys, quizzes, polls) with conditional logic, webhooks and Zapier/Make integrations, plus an embed library. Node.js server, AGPL-3.0, with a self-hosting guide.
- Formbricks: survey-focused (link surveys, in-app and website surveys). The Community Edition is free forever under AGPLv3 and includes the API and webhooks. As of November 2026, Formbricks no longer publishes a price list: its paid Experience Suite (SSO, roles, audit logs, AI analysis) is quoted per customer, with unlimited seats (Formbricks pricing). DevHunt listing: Formbricks.
Getting OpnForm running takes a few commands from its docs:
git clone https://github.com/OpnForm/OpnForm.git
cd OpnForm
chmod +x scripts/docker-setup.sh
./scripts/docker-setup.sh --public-url https://forms.example.com
# later, to update
docker compose pull
docker compose up -d
Leave out --public-url to try it on localhost. On Windows, keep api/artisan on LF line endings or the API container can hang at "Waiting for DB to be ready".
What AGPL-3.0 means in practice: you can run these internally or as a service, but if you modify the code and let users interact with it over a network, you must offer them your modified source. Their enterprise folders (SSO, advanced roles) are under separate commercial licenses.
When to build your own instead
For a fixed set of fields that only your team edits, a drag-and-drop builder is overkill: write the form in code with React Hook Form or a JSON-schema renderer such as react-jsonschema-form (Apache-2.0). If you need a custom builder that matches your design system exactly, Puck or dnd-kit (MIT) plus a JSON schema gives you full control, at the cost of building field settings, validation and conditional logic yourself. That last part is where most homemade builders stall.
How to create a drag and drop form builder with dnd-kit
To create a dynamic form using drag and drop yourself, the core is small: an array of field objects, a sortable list, and a renderer that reads the same array. This React example uses dnd-kit's stable packages (@dnd-kit/core 6.3, @dnd-kit/sortable 10):
npm install @dnd-kit/core @dnd-kit/sortable @dnd-kit/utilities
import { useState } from 'react';
import { DndContext, closestCenter, PointerSensor, KeyboardSensor, useSensor, useSensors } from '@dnd-kit/core';
import {
SortableContext, useSortable, arrayMove, verticalListSortingStrategy, sortableKeyboardCoordinates,
} from '@dnd-kit/sortable';
import { CSS } from '@dnd-kit/utilities';
function SortableField({ field }) {
const { attributes, listeners, setNodeRef, transform, transition } = useSortable({ id: field.id });
return (
<div ref={setNodeRef} style={{ transform: CSS.Transform.toString(transform), transition }}
className="field" {...attributes} {...listeners}>
<label>{field.label}</label>
<input type={field.type} disabled />
</div>
);
}
export default function MiniBuilder() {
const [fields, setFields] = useState([
{ id: 'name', label: 'Name', type: 'text' },
{ id: 'email', label: 'Email', type: 'email' },
]);
const sensors = useSensors(
useSensor(PointerSensor),
useSensor(KeyboardSensor, { coordinateGetter: sortableKeyboardCoordinates }),
);
const add = (type) =>
setFields((f) => [...f, { id: crypto.randomUUID(), label: 'New ' + type + ' field', type }]);
const onDragEnd = ({ active, over }) => {
if (over && active.id !== over.id) {
setFields((f) => arrayMove(f, f.findIndex((x) => x.id === active.id), f.findIndex((x) => x.id === over.id)));
}
};
return (
<>
<button onClick={() => add('text')}>+ Text</button>
<button onClick={() => add('email')}>+ Email</button>
<DndContext sensors={sensors} collisionDetection={closestCenter} onDragEnd={onDragEnd}>
<SortableContext items={fields} strategy={verticalListSortingStrategy}>
{fields.map((field) => <SortableField key={field.id} field={field} />)}
</SortableContext>
</DndContext>
<pre>{JSON.stringify(fields, null, 2)}</pre>
</>
);
}
The fields array is your schema: save it, and render the live form by mapping over it with real inputs. What this sketch leaves out is the long tail: a settings panel per field, validation rules, conditional logic, multi-column layout, undo, and accessibility for screen readers (dnd-kit's keyboard sensor above is a start). Those take weeks, which is why most teams adopt Form.io or Formeo instead.
HTML form builders that export code
Some people want an HTML forms builder that hands back markup to paste into a page, not a hosted form. formBuilder and Formeo both render to standard HTML inputs, and formBuilder can return the definition as XML or JSON for server-side rendering. For a plain contact form on a static site, you don't need a builder at all: write the HTML and post it to a form backend. The free HTML form maker section of our free forms guide has copy-paste markup and compares free form backends such as Formspree and Web3Forms.
A web based form builder (hosted) and an HTML form builder (code) solve different problems. Hosted tools handle storage, spam filtering, notifications and file uploads for you. Exported HTML puts all of that on you, in return for full control of markup and styling.
How to choose
Answer these in order:
- Who builds the forms? Your own team: a hosted tool. Your customers inside your product: an embeddable library.
- Where must the data live? If submissions must stay in your database or region, rule out hosted tools without data residency (Jotform and Typeform offer it on Enterprise) and look at embeddable or self-hosted options.
- How many editors? Jotform below Enterprise and Formstack Forms are single-user. Fillout and Tally include unlimited team members on paid plans.
- What's the license budget? MIT designers (Form.io, formBuilder, Formeo) cost nothing; SurveyJS charges per developer, FormEngine per domain, Vueform and Form.io's platform by subscription.
- Do you need compliance? HIPAA is on Jotform Gold and Enterprise, Typeform Enterprise and as a Formstack add-on. SSO is on Enterprise tiers across the board.
Hosted alternatives
If you don't need to self-host or embed, a hosted builder is less work. Tally, Google Forms, Jotform and others are compared in free web form builders, and there's a list of free Typeform alternatives. More open source tools launched by their makers are on DevHunt's open source page, and hosted builders are in no-code tools. If you are building whole pages, not just forms, see drag and drop web development.
FAQ
What is the best drag-and-drop form creator?
For teams, Jotform has the most features and Tally or Fillout are the easiest to use. For developers embedding a drag and drop form creator in their own app, Form.io's MIT-licensed builder is the most complete free option, and SurveyJS Creator is the most polished paid one.
What is the best open source drag and drop form builder?
To embed in your own app, Form.io's @formio/js: its builder is MIT-licensed, outputs JSON, and has React and Angular wrappers. Formeo and formBuilder are lighter MIT alternatives. To self-host a complete form app, OpnForm or HeyForm. For surveys and product feedback, Formbricks.
What is the easiest drag-and-drop form builder for non-technical teams?
Tally and Fillout. Tally works like a text document where you insert blocks as you type, Fillout uses a classic drag-and-drop canvas with templates, and both connect to Google Sheets without code. Both include unlimited team members on their paid plans.
What is a no code form builder?
A tool where you build a form visually, by dragging fields onto a canvas and setting options in panels, instead of writing HTML and backend code. The vendor hosts the form, stores responses and sends notifications. Jotform, Typeform, Fillout, Tally, Formstack and RapidForms are examples; low code form builders such as Form.io add code hooks for developers.
Is there a free React drag and drop form builder?
Yes. @formio/react wraps Form.io's MIT builder in a FormBuilder component, and Puck (MIT) lets you build a drag-and-drop editor from your own React components. react-form-builder2 is MIT too, but its last release was in May 2025. SurveyJS Creator and FormEngine's designer have React versions but need commercial licenses.
How do I create a dynamic form using drag and drop?
Either embed a builder library (Form.io, Formeo, formBuilder) that outputs a JSON definition and render it with the matching renderer, or build your own: keep the fields in an array, make it sortable with a library such as dnd-kit, and render inputs from the same array. The dnd-kit example above shows the minimal version.
Is there a self-hosted enterprise form builder with JSON-based APIs?
Yes. Form.io is built for this: forms are JSON, the open source API server (formio/formio, OSL-3.0) stores forms and submissions, and the paid self-hosted platform runs as Docker containers on your databases, priced per project and environment. SurveyJS and FormEngine also produce JSON but leave the backend to you.
What is the best drag and drop registration form builder?
For event or course registrations that take payment, Tally (payments on the free plan), Jotform (many payment gateways and templates) and Fillout are strong choices. RapidForms includes an event registration template and payments on its $32/year Hobby plan. If registrations must flow into your own app, embed Form.io and handle payment in your backend.
Can I self-host an open source form builder for free?
Yes. OpnForm, HeyForm, Formbricks and LimeSurvey all publish Docker or server setup guides, and the community editions have no license fee. Check user limits (OpnForm's free self-hosted edition allows 2 users), and plan for the server, updates, backups and spam protection yourself.
Is SurveyJS free?
The SurveyJS Form Library, which renders forms from JSON, is free under MIT. Survey Creator, the drag-and-drop designer, requires a paid developer license to use in your application: Basic costs $589 per developer, one-time, as of November 2026.
Is Form.io free?
The Form.io JavaScript library, including the drag-and-drop builder and renderer, is free under MIT, and you can store the JSON and submissions in your own backend. The hosted Form.io platform is free for a 30-day evaluation, then $300 a month; the self-hosted enterprise platform starts at $330 a month per project plus server environments.
Where can I find drag and drop form builder projects on GitHub?
Search GitHub topics such as form-builder and formbuilder, then check each repo's license file, last commit date and whether it's archived. Many popular-looking repos are unmaintained or license only the renderer.