What should a support form ask for?

Enough that your first reply can be the answer. An order or account ID is the highest-value field, because it turns a vague report into a record you can open before replying. Add a severity selector for triage, a description, and a screenshot upload, which often replaces the whole first exchange.

Should a support form send an automatic reply?

Yes, and it should state a realistic response time. Someone who gets no acknowledgement assumes the form failed and submits again, then emails, then posts publicly — so the missing auto-reply creates the duplicate tickets you then have to reconcile.

Can customers attach screenshots?

Yes, with a file input and the multipart encoding on the form. One screenshot usually carries more than several paragraphs of description, which is why this is one of the two form types here where uploads earn their keep.

Should support tickets go to a person or a shared inbox?

A shared destination, always. Routing to an individual means a ticket waits while that person is away. Point the form's email connector at a team alias, or send submissions into a Slack channel so the queue is visible to everyone who can answer.

Free tool

Support request form generator

Give customers a clean way to reach support. Build a request form with priority levels, style it, and copy the code. Submissions can route straight to Slack or email.

Fields

Required

Submission

Form endpointCreate a free form →

Where submissions go. Paste your form ID to make the code real — or keep the placeholder while you experiment.

On submit

Email subject (optional)

Spam & privacy

Add honeypot spam protection

Design

Styling

Adds Tailwind utility classes. Your project needs Tailwind installed.

AccentRounded

Live preview

Host this form on ShipMyForm →

contact-form.html

<form class="flex w-full max-w-md flex-col gap-4" action="https://shipmyform.com/f/YOUR_FORM_ID" method="POST">
  <label class="flex flex-col gap-1.5">
    <span class="text-sm font-medium text-neutral-200">Name <span class="text-red-500">*</span></span>
    <input class="w-full rounded-lg border px-3 py-2 text-sm outline-none border-neutral-700 bg-neutral-900 text-neutral-100 placeholder-neutral-500 focus:border-[#ffffff] focus:ring-2 focus:ring-[#ffffff]/30" type="text" name="name" autocomplete="name" required />
  </label>
  <label class="flex flex-col gap-1.5">
    <span class="text-sm font-medium text-neutral-200">Email <span class="text-red-500">*</span></span>
    <input class="w-full rounded-lg border px-3 py-2 text-sm outline-none border-neutral-700 bg-neutral-900 text-neutral-100 placeholder-neutral-500 focus:border-[#ffffff] focus:ring-2 focus:ring-[#ffffff]/30" type="email" name="email" placeholder="[email protected]" autocomplete="email" required />
  </label>
  <label class="flex flex-col gap-1.5">
    <span class="text-sm font-medium text-neutral-200">Priority <span class="text-red-500">*</span></span>
    <select class="w-full rounded-lg border px-3 py-2 text-sm outline-none border-neutral-700 bg-neutral-900 text-neutral-100 placeholder-neutral-500 focus:border-[#ffffff] focus:ring-2 focus:ring-[#ffffff]/30" name="priority" required>
      <option value="" disabled selected>Choose…</option>
      <option value="Low">Low</option>
      <option value="Normal">Normal</option>
      <option value="High">High</option>
      <option value="Urgent">Urgent</option>
    </select>
  </label>
  <label class="flex flex-col gap-1.5">
    <span class="text-sm font-medium text-neutral-200">How can we help? <span class="text-red-500">*</span></span>
    <textarea class="w-full rounded-lg border px-3 py-2 text-sm outline-none border-neutral-700 bg-neutral-900 text-neutral-100 placeholder-neutral-500 focus:border-[#ffffff] focus:ring-2 focus:ring-[#ffffff]/30 min-h-[120px]" name="message" required></textarea>
  </label>
  <input type="hidden" name="_subject" value="New support request" />
  <!-- Anti-spam honeypot, leave this empty -->
  <input type="text" name="_gotcha" tabindex="-1" autocomplete="off" aria-hidden="true" style="position:absolute;left:-9999px" />
  <button class="rounded-lg cursor-pointer bg-[#ffffff] px-4 py-2.5 text-sm font-semibold text-black transition-opacity hover:opacity-90" type="submit">Submit request</button>
</form>

Collect enough to answer without a round trip

A support form's job is to gather enough context that the first reply can be the answer. Every missing detail costs an email in each direction and turns a two-minute fix into a two-day thread.

Order or account ID: The single highest-value field here. It turns “something is broken” into a record you can open before you reply.
Severity: Lets you triage a queue without reading all of it. Three options is plenty; five invites deliberation.
Screenshot or attachment: One image usually replaces the entire first exchange. This is the second form type here that needs file uploads.
What happened: Open text, with a placeholder that asks for what they expected and what occurred instead.

The mistake to avoid: No acknowledgement

Someone who gets no confirmation assumes the form is broken. They submit again, then email, then post publicly — so the absence of an auto-reply manufactures the duplicate tickets you then have to reconcile. An automatic reply that states a realistic response time removes most of them.

Route to a shared inbox or a Slack channel rather than a person, so a ticket does not sit unread while one colleague is on holiday. The connector matters more here than on any other form in this list.

How it works

Choose a template and fields. Pick a template, then add, remove, or reorder fields and mark the required ones. Add step breaks to turn a long form into a multi-step form.
Style it. Pick CSS, Tailwind, or unstyled output and tune the theme: accent color, light or dark, rounded corners.
Copy your framework's code. Switch to HTML, React, Vue, Svelte, Astro, or a fetch() version and copy, download, or open it in CodePen.
Connect an endpoint. Create a free ShipMyForm form to get a real endpoint, then drop your form ID in so submissions actually arrive.

Want the background? Read what a form backend is and how to stop form spam without reCAPTCHA. Want the submissions in your inbox? See how to send an HTML form to email. Already have a Google Form? Convert it to HTML. Got a form that submits but delivers nothing? Check its HTML.

Frequently asked questions

What should a support form ask for?: Enough that your first reply can be the answer. An order or account ID is the highest-value field, because it turns a vague report into a record you can open before replying. Add a severity selector for triage, a description, and a screenshot upload, which often replaces the whole first exchange.
Should a support form send an automatic reply?: Yes, and it should state a realistic response time. Someone who gets no acknowledgement assumes the form failed and submits again, then emails, then posts publicly — so the missing auto-reply creates the duplicate tickets you then have to reconcile.
Can customers attach screenshots?: Yes, with a file input and the multipart encoding on the form. One screenshot usually carries more than several paragraphs of description, which is why this is one of the two form types here where uploads earn their keep.
Should support tickets go to a person or a shared inbox?: A shared destination, always. Routing to an individual means a ticket waits while that person is away. Point the form's email connector at a team alias, or send submissions into a Slack channel so the queue is visible to everyone who can answer.