How I Built an API That Turns JSON Into Beautiful HTML Forms
Tags: webdev, javascript, api, forms
Forms are one of the most tedious parts of web development. Every project needs them, and every time you build one from scratch — labels, validation, accessibility, styling — you lose hours on boilerplate.
So I built FormForge, a REST API that takes a JSON schema and returns a fully-styled, accessible HTML form.
The Problem
Building forms well is harder than it looks:
- Field types need different HTML attributes
- Validation rules vary per field
- Accessibility (ARIA labels, error announcements) is easy to forget
- Mobile responsiveness requires careful CSS
- Styling consistency across a project takes effort
The Solution
Send JSON, get HTML:
curl -X POST https://formforge-api.vercel.app/api/json-to-form \
-H "Content-Type: application/json" \
-d '{
"title": "Contact Us",
"theme": "modern",
"fields": [
{"name": "name", "type": "text", "label": "Full Name", "required": true},
{"name": "email", "type": "email", "label": "Email", "required": true},
{"name": "message", "type": "textarea", "label": "Message"}
]
}'
You get back self-contained HTML with embedded CSS and validation JS. Drop it into any page.
Features
4 Themes: Modern (emerald), Corporate (navy), Playful (purple), Minimal (monospace)
10 Field Types: text, email, number, textarea, select, checkbox, radio, date, tel, url
Built-in Validation: Required fields, email format, URL format, phone patterns
Accessible: ARIA attributes, screen reader support, keyboard navigation
Responsive: Works on mobile out of the box
Free Tier
20 forms/day, no credit card required. Get your API key:
curl -X POST https://formforge-api.vercel.app/api/signup \
-H "Content-Type: application/json" \
-d '{"email": "[email protected]"}'
Try It
- Live demo: https://formforge-api.vercel.app
- Docs: https://formforge-api.vercel.app/docs.html
- GitHub: https://github.com/AlberaMarc/formforge-api
Part of the Forge API family — also check out DocForge for document conversion and ReportForge for report generation.
SOCIAL SHARE CARD GENERATOR