Form builder
The builder is where you design a hosted form — the kind we render at formspring.io/p/{slug}. It has three columns:
- Left: the field palette (drag a type onto the canvas).
- Middle: the canvas, a live preview of the form as your visitors will see it.
- Right: the inspector — config for the selected field, or for the form as a whole when nothing is selected.
If you only need a backend endpoint for your own HTML, you can skip the builder entirely. See Forms overview → for the legacy mode.
Adding fields
Drag a type from the palette onto the canvas, or click it to append. Fields snap to the bottom of the current step. Reorder by dragging the handle on the left edge of any field; delete with the trash icon on the right.
Each input field has three things you'll always set:
- Label — what the visitor reads.
- Name — the submission key (
a-z0-9_-, max 64 chars). This is the property in the JSON payload, and the column header in CSV exports. Pick once, don't rename — webhook consumers depend on it. - Required — toggle on if the field must be filled to submit.
Markup-only blocks (heading, divider, html) don't have names — they exist for layout only and never appear in submissions.
The field-config drawer
Selecting a field opens the inspector on the right. Every field has the basics (label, name, placeholder, help text, required). Type-specific config sits below:
select/radio/checkbox— option list (each withvalueandlabel).file—acceptMIME list andmultipletoggle.textarea—rows.number—step, plusmin/maxunder validation.price/computed—formulaand (forprice)amount+currency.
Every input field also has a Validation subsection: min, max, pattern (regex), and a custom error_message. See Validation → for the full reference.
Multi-step forms
Forms default to a single step. To split into pages, open Settings (the cog icon top-right) and toggle Multi-step. Drag a Step divider into the canvas to mark a page break.
Each step is gated: a visitor can't advance until the fields on that step pass validation. The submission still lands as a single payload — steps are purely a UX layout, not separate submissions.
Visibility rules (conditional fields)
Each field has an optional visibility block in its config. Show or hide a field based on the value of another:
{
"visibility": {
"all": [
{ "field": "contact_method", "op": "equals", "value": "email" }
]
}
}
Use all for AND, any for OR. Hidden fields never validate and never appear in the payload.
Theme
Click the canvas background (or the Theme tab in the inspector) to edit the form's design tokens. Color, radius, font, spacing — all stored as a small JSON blob and applied via CSS variables on the public page. Full reference in Themes →.
Settings
The Settings drawer (cog icon) covers everything that isn't a field or a token:
- Multi-step — see above.
- Submit button label — defaults to "Submit".
- Success message — what visitors see after a successful submission.
- Redirect URL — if set, the visitor is sent there instead. We append
?ok=1. - Allowed origins — restrict which domains can POST.
- Honeypot field name — defaults to
_gotcha.
Preview
The canvas is already a live preview, but Preview (top-right) opens the full hosted page in a new tab so you can see exactly what visitors will. The preview URL works for drafts — the public URL doesn't, until you publish.
Publish
Click Publish when you're ready to go live. Publishing does two things:
- Sets
published_aton the form. - Makes
formspring.io/p/{slug}accept visitors.
You can keep editing after publishing — changes go live the moment you save. To take it back down, click Unpublish. See Publishing →.
What's next
- Field types → — every field, every config option
- Validation → — required, regex, min/max, custom messages
- Themes → — color, font, radius, dark mode
- Publishing → — go live, take down, unpublish