Visual Form Builder & Code Generator

Add Form Elements

Click any element to add it directly to your live form.

Form Theme & Styling

Live Form Preview

6 Fields

Field Inspector

form-export.html
123456789101112131415161718192021222324252627282930313233343536373839404142
<!-- Formtruck Generated HTML5 Form -->
<form
action="https://formtruck.com/s/your-form-id"
method="POST"
enctype="multipart/form-data"
class="formtruck-form"
>
<div class="form-group">
<label for="full_name">Full Name *</label>
<input type="text" id="full_name" name="full_name" placeholder="Alex Johnson" required />
</div>
<div class="form-group">
<label for="email_address">Email Address *</label>
<input type="email" id="email_address" name="email_address" placeholder="alex@work.com" required />
</div>
<div class="form-group">
<label for="phone_number">Phone Number</label>
<input type="phone" id="phone_number" name="phone_number" placeholder="+1 (555) 000-0000" />
</div>
<div class="form-group">
<label for="portfolio_or_github_url">Portfolio or GitHub URL</label>
<input type="text" id="portfolio_or_github_url" name="portfolio_or_github_url" placeholder="https://github.com/..." />
</div>
<div class="form-group">
<label for="resume_attachment__pdf_docx_">Resume Attachment (PDF/DOCX) *</label>
<input type="file" id="resume_attachment__pdf_docx_" name="resume_attachment__pdf_docx_" required />
</div>
<div class="form-group">
<label for="why_are_you_a_great_fit_">Why are you a great fit?</label>
<textarea id="why_are_you_a_great_fit_" name="why_are_you_a_great_fit_" placeholder="Brief introduction..." rows="4"></textarea>
</div>
<!-- Anti-spam Honeypot -->
<input type="text" name="_gotcha" style="display:none" tabindex="-1" autocomplete="off" />
<button type="submit">Submit Form</button>
</form>