Menu
Create your first form
Quotes

HTML quote request form template

Gather information useful for an estimate without asking for a full address or documents.

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

Quote request

Service, postal code, and project to qualify a local enquiry.

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 quote request has been stored. We will contact you to clarify your project.">
  <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="fq_name">Your name *</label>
  <input type="text" name="name" id="fq_name" required autocomplete="name" />

  <label for="fq_email">Your email address *</label>
  <input type="email" name="email" id="fq_email" required autocomplete="email" />

  <label for="fq_phone">Phone (optional)</label>
  <input type="tel" name="phone" id="fq_phone" autocomplete="tel" pattern="^\+?(?:[ \(\)\.\-]*[0-9]){7,15}[ \(\)\.\-]*$" maxlength="25" />
  <small>Example: +1 212 555 0123 or +33 6 12 34 56 78.</small>

  <label for="fq_service">Service type *</label>
  <select name="service" id="fq_service" required><option value="">—</option><option>Construction and renovation</option><option>Website development</option><option>Consulting</option><option>Another service</option></select>

  <label for="fq_postal_code">Postal code (optional)</label>
  <input type="text" name="postal_code" id="fq_postal_code" autocomplete="postal-code" maxlength="20" />
  <small>Postal or ZIP code, if your address has one.</small>

  <label for="fq_message">Describe your project *</label>
  <textarea name="message" id="fq_message" required maxlength="5000" rows="5"></textarea>

  <button type="submit">Request a quote</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. Adapt services to your activity before publishing.
  2. The form sends a request: it calculates no price and creates no contract.
  3. Phone stays optional to limit collection.
  4. Create your form using “Use this template”. Its fields and your customizations will carry over.
  5. Verify the recipient, publish the form, then replace the key in the copied code.
  6. Send an identified test and inspect the stored message and then its delivery.

Frequently asked questions

Is this a binding quote?

No. It is an information request to prepare a quote.

Can I change the services?

Yes, edit options in the form builder and republish the configuration.