Free Product Launch Waitlist Form Generator

<!-- Waitlist Form -->
<form action="https://myformconnect.io/widget/submit" method="POST" class="space-y-4">
  <input type="hidden" name="form_id" value="your-form-uuid">
  
  <h3 class="text-lg font-semibold text-gray-800 mb-4">Custom Demo</h3>
  
  <div>
    <label for="name" class="block text-sm font-medium text-gray-700 mb-2">Full Name</label>
    <input type="text" id="name" name="name" required class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter your full name">
  </div>
  
  <div>
    <label for="email" class="block text-sm font-medium text-gray-700 mb-2">Email Address</label>
    <input type="email" id="email" name="email" required class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter your email">
  </div>
  
  <div>
    <label for="role" class="block text-sm font-medium text-gray-700 mb-2">Job Title/Role</label>
    <input type="text" id="role" name="role" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter your job title">
  </div>
  
  <div>
    <label for="domain" class="block text-sm font-medium text-gray-700 mb-2">Company Domain</label>
    <input type="text" id="domain" name="domain" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500" placeholder="Enter your company domain (e.g., example.com)">
  </div>
  
  <div>
    <label for="traffic" class="block text-sm font-medium text-gray-700 mb-2">Expected Traffic</label>
    <select id="traffic" name="traffic" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
      <option value="">Select expected traffic</option>
      <option value="0-1k">0 - 1K visitors/month</option>
      <option value="1k-10k">1K - 10K visitors/month</option>
      <option value="10k-50k">10K - 50K visitors/month</option>
      <option value="50k-100k">50K - 100K visitors/month</option>
      <option value="100k+">100K+ visitors/month</option>
    </select>
  </div>
  
  <div>
    <label for="referral" class="block text-sm font-medium text-gray-700 mb-2">How did you hear about us?</label>
    <select id="referral" name="referral" class="w-full px-3 py-2 border border-gray-300 rounded-md focus:outline-none focus:ring-2 focus:ring-blue-500">
      <option value="">Select an option</option>
      <option value="social-media">Social Media</option>
      <option value="search-engine">Search Engine</option>
      <option value="friend-referral">Friend Referral</option>
      <option value="blog-post">Blog Post</option>
      <option value="other">Other</option>
    </select>
  </div>
  
  <button type="submit" class="w-full fs-button text-white py-2 px-4 rounded-md hover:bg-blue-700 focus:outline-none focus:ring-2 focus:ring-blue-500 focus:ring-offset-2 transition">Submit</button>
</form>

<style>
.fs-button {
  background-color: #3b82f6;
  transition: background-color 0.2s;
}
.fs-button:hover {
  background-color: #2563eb;
}
</style>