Skip to content

Quickstart: Create Your First Form

Welcome to Basin! This quickstart guide will help you create your first form in just a few minutes. Whether you're a developer or prefer no-code solutions, we have the perfect approach for you.

Choose Your Path

🎨 Option 1: Visual Form Builder (Best No-Code Solution)

Our drag-and-drop form builder is the most powerful no-code way to create professional forms with advanced features like conditional logic, multi-step flows, and built-in hosting.

  1. Sign up for a Basin account at usebasin.com
  2. Click "Create a Form" from your dashboard and create a new form
  3. Select "Basin Form Builder" from the "Form Builders" dropwdown
  4. Drag and drop form components (text fields, dropdowns, file uploads, etc.)
  5. Configure styling and form logic as needed
  6. Publish your form - embed as iframe or use Basin's hosted URL

Perfect for: No-code users, complex forms, team collaboration, professional styling

Learn more about Form Builder →

📝 Option 2: Simple HTML Form (Best for Developers)

If you prefer writing your own HTML or already have a form, this is the most straightforward approach.

Step 1: Create Your HTML Form

Start with this basic form template:

<form action="#" method="POST">
  <label for="email">Email Address</label>
  <input type="email" id="email" name="email" required>

  <label for="name">Name</label>
  <input type="text" id="name" name="name" required>

  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <button type="submit">Submit</button>
</form>

Step 2: Get Your Form Endpoint

  1. Sign up for a Basin account at usebasin.com
  2. Click "Create a Form" from your dashboard
  3. Give your form a name (e.g., "Contact Form")
  4. Copy your unique endpoint URL (looks like https://usebasin.com/f/1a2b3c4d5e6f)

Step 3: Connect Your Form

Replace the action="#" in your HTML with your Basin endpoint:

<form action="https://usebasin.com/f/YOUR-FORM-ID" method="POST">
  <!-- your form fields -->
</form>

That's it! Your form will now send submissions to Basin.

Perfect for: Developers, custom styling, existing forms, maximum control

Learn more about Form Backend →

⚡ Quick Enhancement: Add AJAX & Spam Protection

Want to make your form even better? Add Basin JS for AJAX submissions and spam protection:

  1. Add the Basin JS script before your closing </body> tag: 

    <script src="https://js.usebasin.com/v2.8.0.min.js" defer></script>

  2. Update your form with these attributes: 

    <form action="https://usebasin.com/f/YOUR-FORM-ID" method="POST" 
      data-basin-form 
      data-basin-success-action="render"
      data-basin-spam-protection="recaptcha">
  <!-- your form fields -->
</form>

  3. Add success and error messages: 

    <div class="w-form-done" style="display: none;">
  Thank you! Your message has been sent.
</div>
<div class="w-form-fail" style="display: none;">
  Oops! Something went wrong. Please try again.
</div>

  4. Enable spam protection in your Basin form settings (Form → Settings → Spam)

Now your form submits without page reloads and includes spam protection!

Learn more about Basin JS →

🤖 Option 3: AI Form Generator (Quick HTML Generation)

Want AI to generate custom HTML forms for you? Our AI-powered form generator creates styled HTML forms based on your descriptions.

  1. Sign up for a Basin account at usebasin.com
  2. Click "AI Form Generator" from your dashboard
  3. Describe your form in plain English (e.g., "Contact form with name, email, message, and a submit button")
  4. Choose styling: Match your website URL, use a CSS framework, or go with default styling
  5. Copy the generated HTML and paste it into your website

Perfect for: Quick prototypes, custom HTML needs, styled forms that match your website

Learn more about AI Form Generator →

What's Next?

Once your form is collecting submissions:

  • View submissions in your Basin dashboard
  • Set up email notifications to get notified of new submissions
  • Add integrations to send data to other tools (Slack, Google Sheets, etc.)
  • Configure spam protection to filter out unwanted submissions
  • Set up webhooks for real-time data processing

Need Help?

Ready to get started? Sign up for Basin and create your first form in minutes!