Form builder
Add and arrange fields, style your form with a theme and accent color, and copy embed code for any site or framework.
The form builder defines your form's fields and designs the styled embed. Open it from the form's Setup tab with Design the form or Add fields.
The builder shows your fields on one side and a live preview on the other. You can try the fields in the preview. It never sends anything.
Fields
Choose Add field and pick a type:
| Type | Use it for |
|---|---|
| Short text | Names, companies, single-line answers |
| Email addresses | |
| Long text | Messages and comments |
| Number | Quantities, budgets, ages |
| Date | Dates like an event day or a birthday |
| Dropdown | One choice from a list |
| Multiple choice | One choice from a list, shown as radio buttons |
| Checkbox | A single yes or no, like agreeing to terms |
| Star rating | A rating from 1 to 3 through 10 stars |
| Phone | Phone numbers |
| Website | URLs |
| File upload | Images and PDFs. Needs file uploads turned on, which is Pro. |
A form can have up to 30 fields. Drag a field to reorder it, or focus it and press the up and down arrow keys. Each field also has options to move, duplicate or delete it. After a delete, Undo is available for a few seconds.
Field settings
Select a field to edit it:
- Label: the question shown to visitors, and the label in your inbox and notifications.
- Field name: the key answers are saved under, and the
nameyour HTML must use. It must start with a letter and can use letters, digits,-and_, up to 64 characters. Each name can only be used once per form. - Required: visitors must answer before they can send the form.
- Placeholder: example text shown inside empty text fields, or the prompt shown before a dropdown choice is made.
- Help text: a short hint shown under the field.
- Options for dropdowns and multiple choice, up to 100.
- Minimum and Maximum for numbers.
- Number of stars for ratings, from 3 to 10.
- Character limit for short and long text.
If you rename a field after it has received answers, earlier answers stay under the old name. The builder reminds you of this.
Fields are also what Nisuform checks submissions against. See Fields and validation.
Design
The design panel styles the embed:
- Theme: Light, Dark, Paper or Euphoria.
- Accent color: the color of the button and highlights. Pick a preset or enter a hex code. The builder warns you when the color is hard to see against the theme's background.
- Title and Description: shown above the fields. Leave them empty to hide them.
- Button label: the text on the submit button.
- Success message: replaces the form after a successful submit. Visitors without JavaScript see the thank-you page instead.
Save
The header shows Unsaved changes until you save. Press Ctrl+S, or Cmd+S on a Mac, to save from anywhere in the builder. Leaving with unsaved changes asks you to confirm first.
Get the code
Choose Get code to copy the form for your site. The code is from your last save, so save first to include your latest changes.
| Tab | What you get |
|---|---|
| HTML | One snippet with the markup, styles and script. Paste it anywhere. |
| React | A component that renders the form and handles sending, success and errors. |
| Next.js | The same component marked as a client component, for the App Router and the Pages Router. |
| Vue | A single-file component. It works in Nuxt too. |
| Svelte | A component. It works in SvelteKit too. |
| Astro | Markup with inline styles and script, so Astro doesn't bundle or scope them. |
The embed includes the honeypot and sends the fill time for spam protection, adds the Turnstile widget when Turnstile is on for the form, and follows your redirect URL when the form has one. It submits with fetch and shows your success message in place, and it still posts as a normal form when JavaScript is off.
The Setup tab has step-by-step guides for site builders, code and AI tools.
Use your own markup instead
You don't have to use the embed. On the Setup tab, switch to Your own styles for plain markup with your field names that picks up your site's CSS, or write your own form. Nisuform validates whatever arrives against your fields either way.