Menu
Create your first form
Contact

A support request form with useful diagnostic context

Collect enough diagnostic context to route a support request without asking visitors to expose passwords, tokens, or unnecessary personal data.

Local preview: changes stay in this browser. No message or email is sent.

Support request

Get the right details to your team.

1 / 1
LittleReply
Customize the template
Labels and required fields

Add your identity, purpose, applicable basis, retention, rights contact, and privacy link. This example is not legal advice.

Standalone HTML / CSS
<!doctype html>
<html lang="en"><head><meta charset="utf-8"><meta name="viewport" content="width=device-width,initial-scale=1"><title>Contact form</title>
<style>form[data-littlereply]{max-width:640px;margin:2rem auto;padding:1.5rem;font:16px/1.6 system-ui,sans-serif;color:#202033;background:white;border:1px solid #e4e4ee;border-radius:16px;box-sizing:border-box}form[data-littlereply] label{display:block;margin-top:1rem;font-weight:600}form[data-littlereply] input,form[data-littlereply] textarea,form[data-littlereply] select{box-sizing:border-box;width:100%;padding:.75rem;font:inherit;border:1px solid #727285;border-radius:8px;background:white;color:#202033}form[data-littlereply] input[type=checkbox],form[data-littlereply] input[type=radio]{width:auto}form[data-littlereply] button{margin-top:1rem;padding:.8rem 1.1rem;font:inherit;font-weight:600;border:0;border-radius:8px;background:var(--form-accent,#4f46e5);color:white;cursor:pointer}form[data-littlereply] :focus-visible{outline:3px solid #f59e0b;outline-offset:3px}form[data-littlereply] button:disabled{opacity:.6}form[data-littlereply] [role=status]{min-height:1.6em}form[data-littlereply] fieldset{border:0;padding:0}form[data-littlereply] .privacy-notice{font-size:.875rem;color:#4b4b60}
form[data-littlereply]{--form-accent:#4f46e5;--form-ink:#ffffff}
form[data-littlereply] button{color:var(--form-ink)}form[data-littlereply] button[data-fq-back]{background:#eee;color:#202033}form[data-littlereply] [hidden]{display:none}</style></head><body>
<form action="https://littlereply.com/api/submit" method="POST" data-littlereply="YOUR_ACCESS_KEY" data-locale="en" data-success="Your message has been received.">
  <input type="hidden" name="_fq_key" value="YOUR_ACCESS_KEY" />
  <input type="text" name="botcheck" tabindex="-1" autocomplete="off" style="display:none" aria-hidden="true" />

  <label for="support-name">Full name *</label>
  <input type="text" name="name" id="support-name" required />

  <label for="support-email">Email address *</label>
  <input type="email" name="email" id="support-email" required />

  <label for="support-department">Department (optional)</label>
  <select name="department" id="support-department"><option value="">—</option><option>Sales</option><option>Support</option><option>Billing</option></select>

  <label for="support-message">Message *</label>
  <textarea name="message" id="support-message" required rows="5"></textarea>

  <button type="submit">Send message</button>
  <p role="status" aria-live="polite"></p>
</form>
<!-- Accessible AJAX errors and duplicate-safe retries -->
<script src="https://littlereply.com/client/v1.js" data-api="https://littlereply.com" defer></script>
</body></html>

Replace YOUR_ACCESS_KEY with your form's public key. The code includes its styles and an AJAX enhancement; the native HTML POST also works without JavaScript.

Install this template

  1. Ask for timestamps, public IDs, and error messages rather than credentials.
  2. Keep department choices stable so routing rules remain understandable.
  3. Explain that submission receipt is different from a response-time commitment.
  4. Select “Use this template” to carry the current configuration into signup.
  5. Verify recipients, publish the form, and replace the example key in the generated code.
  6. Send a recognizable test and inspect storage and delivery separately.

Frequently asked questions

Does this template send a real submission in preview?

No. The public preview stays in your browser. Create and publish a form before using its public key on a live site.

Can I change the fields and styling?

Yes. Customize labels, requirements, colors, confirmation text, and the published schema before installing the generated code.