<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: FORMSUBMIT</title>
    <description>The latest articles on DEV Community by FORMSUBMIT (@formsubmit).</description>
    <link>https://dev.to/formsubmit</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3945280%2F29e1ec32-5db6-4540-87e0-51f1e2bd793f.png</url>
      <title>DEV Community: FORMSUBMIT</title>
      <link>https://dev.to/formsubmit</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/formsubmit"/>
    <language>en</language>
    <item>
      <title>formsubmit</title>
      <dc:creator>FORMSUBMIT</dc:creator>
      <pubDate>Fri, 22 May 2026 05:42:12 +0000</pubDate>
      <link>https://dev.to/formsubmit/formsubmit-1alc</link>
      <guid>https://dev.to/formsubmit/formsubmit-1alc</guid>
      <description></description>
    </item>
    <item>
      <title>Create Any Form with FormSubmit's AI Builder – Zero Coding Required</title>
      <dc:creator>FORMSUBMIT</dc:creator>
      <pubDate>Fri, 22 May 2026 05:39:28 +0000</pubDate>
      <link>https://dev.to/formsubmit/create-any-form-with-formsubmits-ai-builder-zero-coding-required-163n</link>
      <guid>https://dev.to/formsubmit/create-any-form-with-formsubmits-ai-builder-zero-coding-required-163n</guid>
      <description>&lt;p&gt;You don't need to be a developer to create professional HTML forms. FormSubmit's AI Builder lets you describe the form you need in plain English, and it generates a complete, ready‑to‑use HTML code in seconds. No coding, no fiddling with HTML tags, no designing – just type and click.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F691zjoi3yk844ogdvqpr.png" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2F691zjoi3yk844ogdvqpr.png" alt=" " width="800" height="420"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;This guide shows you how to use the AI Builder, the types of forms you can create, and how to integrate the generated form into your website.&lt;/p&gt;

&lt;p&gt;Why use an AI form builder?&lt;br&gt;
Traditional form builders require manual drag‑and‑drop or hand‑coding each field. The AI builder eliminates that effort. You simply describe what you want, and the AI understands your requirements, selects appropriate field types, and outputs a fully functional form. It's perfect for:&lt;/p&gt;

&lt;p&gt;Non‑technical users who want a custom form without learning HTML.&lt;br&gt;
Developers who want to save time on repetitive form coding.&lt;br&gt;
Rapid prototyping and testing of different form layouts.&lt;br&gt;
Creating complex forms with conditional logic (the AI can generate the base structure).&lt;br&gt;
How to use the AI Builder&lt;br&gt;
Go to formsubmit.cc and scroll down to the AI Form Builder section.&lt;br&gt;
Ensure you've already entered your domain and notification email (the fields above).&lt;br&gt;
In the “Describe your form” textarea, type a natural language description of the form you need. For example:&lt;br&gt;
Create a customer support ticket form with fields for name, email, issue type (dropdown: billing, technical, general), priority (radio: low, medium, high), and a detailed message textarea.&lt;br&gt;
Select one of the 10 visual styles (Simple Light, Dark Business, Rounded Cards, etc.).&lt;br&gt;
Click Generate form.&lt;br&gt;
Within seconds, the generated form appears in the preview iframe, and the HTML code is shown below.&lt;br&gt;
Click Copy code and paste it into your website.&lt;br&gt;
The AI understands various field types: text, email, tel, number, date, dropdown, radio, checkbox, textarea, and more. It also automatically adds required attributes where appropriate.&lt;/p&gt;

&lt;p&gt;Examples of what you can create&lt;br&gt;
Example 1: Event registration form&lt;br&gt;
Create an event registration form with name, email, phone, ticket type (Early Bird, Regular, VIP), number of guests, and a dietary restrictions textarea.&lt;br&gt;
The AI will generate fields for all those inputs, with appropriate validation and labels.&lt;/p&gt;

&lt;p&gt;Example 2: Job application form&lt;br&gt;
Build a job application form with full name, email, position dropdown (Developer, Designer, Manager), resume upload (note: file upload not supported yet – but the AI will add a text field), cover letter textarea, and a checkbox for agreeing to terms.&lt;br&gt;
Note: File upload is currently not supported by FormSubmit, but the AI will create a text field where applicants can describe their resume link – you can manually replace it later if needed.&lt;/p&gt;

&lt;p&gt;Example 3: Product feedback form&lt;br&gt;
Create a product feedback form with name, email, rating (1-5 stars dropdown), a dropdown for feature request category, and an optional textarea for additional comments.&lt;br&gt;
Example 4: Appointment booking form&lt;br&gt;
Make an appointment booking form with full name, email, phone, preferred date (date picker), time slot dropdown (morning, afternoon, evening), and a message field.&lt;br&gt;
Choosing a style&lt;br&gt;
You can choose from 10 professionally designed CSS themes:&lt;/p&gt;

&lt;p&gt;Simple Light – clean white card, subtle shadows.&lt;br&gt;
Dark Business – elegant dark theme with purple accents.&lt;br&gt;
Rounded Cards – large border radius, playful gradient borders.&lt;br&gt;
Shadow – deep shadows for a premium look.&lt;br&gt;
Minimal – borderless, airy design.&lt;br&gt;
Gradient – vibrant gradient background.&lt;br&gt;
Warm Orange – friendly peach/orange tones.&lt;br&gt;
Cool Blue – icy blues, calm and professional.&lt;br&gt;
Tech Dark – monospace, terminal vibe.&lt;br&gt;
Classic – traditional, no‑fuss.&lt;br&gt;
You can switch styles anytime – the AI will regenerate the form with the new styling without changing the fields.&lt;/p&gt;

&lt;p&gt;Usage limits (free vs. Business)&lt;br&gt;
Free users: 5 generations per IP per day. This is plenty for testing and occasional use.&lt;br&gt;
Business users: Unlimited generations. Once you upgrade your email address, you can generate as many forms as you want.&lt;br&gt;
If you exceed the daily limit, you'll see a friendly message prompting you to upgrade or wait until tomorrow.&lt;/p&gt;

&lt;p&gt;How the AI works&lt;br&gt;
The AI Builder is powered by DeepSeek's language model. Your description is sent securely to the API, which returns a pure HTML snippet (no &lt;/p&gt; tag, just the inner fields). Our backend then wraps the fields with the necessary hidden fields (_domain, _to), the selected CSS style, and the submit button. The result is a complete, standalone HTML form that submits directly to FormSubmit's endpoint.

&lt;p&gt;We do not store your descriptions or the generated forms – they are only processed in memory and returned to you.&lt;/p&gt;

&lt;p&gt;Comparing AI Builder vs. manual coding&lt;br&gt;
Aspect  AI Builder  Manual Coding&lt;br&gt;
Speed   Seconds Minutes to hours&lt;br&gt;
Coding skill required   None    HTML knowledge needed&lt;br&gt;
Customization   High (via description)  Full control&lt;br&gt;
Learning curve  Zero    Steep for beginners&lt;br&gt;
Consistency Auto‑styled   Depends on developer&lt;br&gt;
Tips for getting the best results from the AI&lt;br&gt;
Be specific – mention field types (text, email, dropdown, textarea) and any options.&lt;br&gt;
Use plain English – the AI understands natural language, not code.&lt;br&gt;
Keep it concise – very long descriptions may cause the AI to omit details.&lt;br&gt;
Mention required fields – say “required” next to fields you want mandatory.&lt;br&gt;
If you don't like the result, just regenerate – you can tweak your description and try again.&lt;br&gt;
Integrating the generated form&lt;br&gt;
Once you have the HTML code, you can paste it into any website – WordPress (Custom HTML block), static HTML, Shopify, React (with dangerouslySetInnerHTML), or even email templates (though email support is limited). The form will automatically submit to FormSubmit's API and forward submissions to your email.&lt;/p&gt;

&lt;p&gt;You can also further customize the generated code – add your own CSS classes, change field names, or add additional JavaScript validation. The only requirement is to keep the hidden fields _domain and _to.&lt;/p&gt;

&lt;p&gt;Limitations&lt;br&gt;
The AI cannot generate file upload fields (not supported by FormSubmit).&lt;br&gt;
Complex conditional logic (show/hide fields based on previous answers) is not currently supported by the AI, but you can manually add JavaScript.&lt;br&gt;
Payment fields (Stripe/PayPal) are not generated – use our manual PayPal integration instead.&lt;br&gt;
Frequently asked questions&lt;br&gt;
❓ Can I edit the generated form after I copy it?&lt;br&gt;
Absolutely. You have full HTML code. Modify anything.&lt;/p&gt;

&lt;p&gt;❓ Does the AI store my descriptions?&lt;br&gt;
No. We only send your description to DeepSeek temporarily; we don't keep logs.&lt;/p&gt;

&lt;p&gt;❓ What languages does the AI understand?&lt;br&gt;
English works best, but it can handle other languages and will generate English labels (consistent with FormSubmit's interface).&lt;/p&gt;

&lt;p&gt;❓ Why did the AI not generate a field I asked for?&lt;br&gt;
The AI might misinterpret a vague description. Try rephrasing or being more explicit about the field type.&lt;a href="https://www.formsubmit.cc" rel="noopener noreferrer"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>AI Form Builder – Advanced Customization &amp; Integration Guide</title>
      <dc:creator>FORMSUBMIT</dc:creator>
      <pubDate>Fri, 22 May 2026 05:35:47 +0000</pubDate>
      <link>https://dev.to/formsubmit/ai-form-builder-advanced-customization-integration-guide-38nc</link>
      <guid>https://dev.to/formsubmit/ai-form-builder-advanced-customization-integration-guide-38nc</guid>
      <description>&lt;p&gt;FormSubmit's AI Form Builder lets you generate complex HTML forms from natural language descriptions. But what if you need to go beyond the generated output? This guide covers advanced techniques: custom CSS styling, adding JavaScript validation, implementing conditional fields, and integrating the generated form into complex web applications.&lt;/p&gt;

&lt;p&gt;&lt;a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcmrjfvs9xfawbdu9527b.jpg" class="article-body-image-wrapper"&gt;&lt;img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Farticles%2Fcmrjfvs9xfawbdu9527b.jpg" alt=" " width="799" height="421"&gt;&lt;/a&gt;&lt;/p&gt;

&lt;p&gt;Quick recap: generating a form with AI&lt;br&gt;
On the FormSubmit homepage, enter your domain and email, then describe the form you need. For example:&lt;/p&gt;

&lt;p&gt;Create a project request form with name, email, company, budget range (dropdown), timeline (radio: urgent, normal, flexible), and project description textarea.&lt;br&gt;
Select a style, click “Generate”, and you'll receive a complete HTML code. Copy it and paste into your site. But that's just the start.&lt;/p&gt;

&lt;p&gt;Customizing the generated CSS&lt;br&gt;
The AI output includes inline styles or Tailwind classes. You can replace the entire  block with your own CSS. For example, if you want your form to match your brand exactly, extract the field structure and apply your own stylesheet.&amp;lt;/p&amp;gt;

&amp;lt;!-- Keep the HTML structure, replace the style --&amp;gt;

&amp;lt;style&amp;gt;
  .custom-form { max-width: 600px; margin: 0 auto; }
  .custom-form input, .custom-form textarea, .custom-form select {
    width: 100%; padding: 10px; margin: 8px 0; border: 1px solid #ccc; border-radius: 4px;
  }
  .custom-form button { background: #007bff; color: white; padding: 10px 20px; border: none; border-radius: 4px; }


&lt;/p&gt;... form fields ...

&lt;p&gt;Adding JavaScript validation&lt;br&gt;
The generated HTML already includes required attributes for basic validation. For more complex rules (e.g., password confirmation, custom email domain, minimum/maximum values), you can attach a JavaScript event listener.&lt;/p&gt;


  document.querySelector('form').addEventListener('submit', function(e) {
    let email = document.querySelector('input[name="email"]').value;
    if (!email.endsWith('@mycompany.com')) {
      alert('Please use your company email address.');
      e.preventDefault();
    }
  });


&lt;p&gt;Implementing conditional fields (show/hide based on previous answers)&lt;br&gt;
The AI doesn't generate conditional logic out of the box, but you can add it manually. For example, show a textarea only when a specific option is selected.&lt;/p&gt;

&lt;p&gt;&lt;br&gt;
  General&lt;br&gt;
  Technical support&lt;br&gt;
&lt;/p&gt;

&lt;p&gt;document.getElementById('topic').addEventListener('change', function() {&lt;br&gt;
    const div = document.getElementById('technicalDetails');&lt;br&gt;
    div.style.display = this.value === 'technical' ? 'block' : 'none';&lt;br&gt;
  });&lt;/p&gt;

&lt;p&gt;Integrating with external services using webhooks&lt;br&gt;
Add a hidden _webhook field to send form data to your CRM, Slack, or custom endpoint. For example, to post to Slack:&lt;/p&gt;

&lt;p&gt;&lt;br&gt;
When the form is submitted, FormSubmit will send a JSON payload to that URL in addition to email. This enables real‑time notifications and data integration.&lt;/p&gt;

&lt;p&gt;Modifying the email subject and template&lt;br&gt;
Use hidden fields to control the email you receive:&lt;/p&gt;

&lt;p&gt;_subject – Custom subject line.&lt;br&gt;
_replyto – Sets the “Reply-To” header (useful if you collect the user's email).&lt;br&gt;
_template – Set to table for a nicer HTML email layout.&lt;br&gt;
&lt;br&gt;
&lt;br&gt;
Redirect after submit – keeping users on your site&lt;br&gt;
By default, the form shows a success page. To redirect to your own thank‑you page, add:&lt;/p&gt;

&lt;p&gt;&lt;br&gt;
Using the AI builder with multi‑step forms&lt;br&gt;
The AI generates single‑page forms. For multi‑step (wizard) forms, generate a single‑page form first, then split it into multiple steps using JavaScript. Many jQuery and vanilla JS libraries can help (e.g., step‑by‑step wizards). Ensure all fields eventually submit to the same FormSubmit endpoint.&lt;/p&gt;

&lt;p&gt;Customizing the success message&lt;br&gt;
If you don't redirect, the default success page is minimal. You can replace it by using the _next redirect to a custom page. That page can display any message you like and include a button to return to your site.&lt;/p&gt;

&lt;p&gt;Handling file uploads (workaround)&lt;br&gt;
FormSubmit doesn't support file uploads directly. Workaround: let users paste a link to their file (Google Drive, Dropbox) in a text field, or use a third‑party upload service that returns a URL, then include that URL as a hidden field.&lt;/p&gt;

&lt;p&gt;Integrating with React/Vue/Angular&lt;br&gt;
The generated HTML is plain, so you can use it directly inside a React component with dangerouslySetInnerHTML. Or, better, rebuild the form using your framework's components but keep the same field names and the same action URL. FormSubmit accepts standard form POSTs from any origin.&lt;/p&gt;

&lt;p&gt;// React example&lt;/p&gt;

&lt;p&gt;...&lt;/p&gt;

&lt;p&gt;Testing your customized form&lt;br&gt;
Always test thoroughly after modifications. Submit test entries and verify:&lt;/p&gt;

&lt;p&gt;You receive the email (check spam).&lt;br&gt;
Custom validation works.&lt;br&gt;
Conditional fields show/hide correctly.&lt;br&gt;
Redirects and webhooks fire.&lt;br&gt;
Frequently asked questions about customization&lt;br&gt;
❓ Can I change the form method to GET?&lt;br&gt;
No, FormSubmit only accepts POST requests.&lt;/p&gt;

&lt;p&gt;❓ How do I add a CAPTCHA?&lt;br&gt;
You can manually add Google reCAPTCHA v2 or v3 to your form. The user's response token can be verified on your own server, or you can use a webhook to validate it (FormSubmit doesn't verify CAPTCHAs directly).&lt;/p&gt;

&lt;p&gt;❓ Will my custom CSS be lost if I regenerate the form?&lt;br&gt;
Yes. If you use the AI builder again, it will overwrite your changes. Always save a copy of your customized code outside the AI tool.&lt;/p&gt;

&lt;p&gt;Ready to build advanced forms with FormSubmit?&lt;br&gt;
The AI Form Builder gives you a powerful starting point, and with these customization techniques, you can build virtually any type of form – from simple contact forms to complex, interactive applications. Best of all, you still get zero‑data‑storage and instant email forwarding.&lt;/p&gt;

</description>
      <category>ai</category>
      <category>javascript</category>
      <category>tutorial</category>
      <category>webdev</category>
    </item>
    <item>
      <title>A simple and hassle-free form tool for integrating with the website Wordpress</title>
      <dc:creator>FORMSUBMIT</dc:creator>
      <pubDate>Fri, 22 May 2026 05:28:00 +0000</pubDate>
      <link>https://dev.to/formsubmit/a-simple-and-hassle-free-form-tool-for-integrating-with-the-website-wordpress-37oc</link>
      <guid>https://dev.to/formsubmit/a-simple-and-hassle-free-form-tool-for-integrating-with-the-website-wordpress-37oc</guid>
      <description>&lt;p&gt;I need to integrate a simple online form tool into several of my websites, but I've tried many platforms and none of them work. I've even paid for platforms that stopped working after a few months, which is very frustrating. I work in the home furnishing industry, specializing in custom-made doors and windows. I'm located in Foshan, Guangdong, China. To facilitate my foreign trade business, I've used WordPress to create dozens of websites for marketing purposes.&lt;br&gt;
&lt;a href="https://www.formsubmit.cc/" rel="noopener noreferrer"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
    <item>
      <title>formsubmit, simple</title>
      <dc:creator>FORMSUBMIT</dc:creator>
      <pubDate>Fri, 22 May 2026 05:22:27 +0000</pubDate>
      <link>https://dev.to/formsubmit/formsubmit-simple-1boc</link>
      <guid>https://dev.to/formsubmit/formsubmit-simple-1boc</guid>
      <description>&lt;p&gt;"formsubmit, a simple online form tool I made on the spot.".&lt;br&gt;
&lt;a href="https://www.formsubmit.cc/" rel="noopener noreferrer"&gt;&lt;/a&gt;&lt;/p&gt;

</description>
    </item>
  </channel>
</rss>
