Can I just tell Lovable to add this instead of editing code myself?

Yes — paste the prompt above into Lovable's chat with your endpoint URL swapped in. Lovable treats it like any other feature request and rewires the existing submit handler.

Does this conflict with Lovable's Supabase integration?

No. If your project already uses Supabase for auth or data, that's unaffected — PostTo only replaces the "send this form as an email" piece, which otherwise would need its own Edge Function.

Will this survive a Lovable redeploy or GitHub sync?

Yes — it's a plain fetch call inside your component code, so it persists through redeploys, GitHub sync, and further edits the same as any other code Lovable writes.

The free plan includes 50 submissions per month with the full dashboard — no credit card required. Paid plans start at $9/month.

AI app builder · Lovable

Make your Lovable contact form actually send email

Lovable builds a polished contact form fast — but by default it has nowhere to send. Wiring it up the "proper" way usually means asking Lovable for a Supabase Edge Function, an email provider API key, and a secret to store, which is a lot of backend for "add a contact form."

Point the form at a PostTo endpoint instead and it delivers to your inbox immediately — no Edge Function, no Supabase secrets, no provider to configure. Paste one prompt into Lovable's chat and the existing form is rewired, fields and design untouched.

Start for free Jump to the prompt

Free plan, no credit card required.

Three steps, a few minutes

Create an endpoint

Sign up free and create a PostTo endpoint with your destination email. You get an endpoint URL immediately — no OAuth connection or API key exchange with Lovable required.

Paste the prompt into Lovable

Give Lovable the prompt below with your endpoint URL swapped in. It edits the existing form's submit handler in place — your layout, fields, and styling stay exactly as they are.

Test it in the preview

Submit the form from Lovable's live preview. The email lands in your inbox, and the submission shows up in the PostTo dashboard immediately.

The prompt and the code

Replace YOUR_TOKEN with the endpoint URL from your dashboard.

Prompt to paste into Lovable's chat

Update the contact form's submit handler to send its data to PostTo instead of
just showing a fake success state. On submit, POST the form fields as JSON to
https://postto.dev/api/v1/send/YOUR_TOKEN with a
"Content-Type: application/json" and "Accept: application/json" header. Show
the existing success state if the response is ok, and the existing error
state otherwise. Add a hidden "_hp" honeypot input that real visitors never
see. Keep all other current fields, validation, and styling unchanged.

src/components/ContactForm.tsx — what Lovable typically writes

export function ContactForm() {
  const [status, setStatus] = useState<'idle' | 'sent' | 'error'>('idle');

  async function handleSubmit(e: React.FormEvent<HTMLFormElement>) {
    e.preventDefault();
    const payload = Object.fromEntries(new FormData(e.currentTarget));

    const res = await fetch('https://postto.dev/api/v1/send/YOUR_TOKEN', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json',
        'Accept': 'application/json',
      },
      body: JSON.stringify(payload),
    });

    setStatus(res.ok ? 'sent' : 'error');
  }

  return (
    <form onSubmit={handleSubmit}>
      <input type="text" name="name" placeholder="Name" required />
      <input type="email" name="email" placeholder="Email" required />
      <textarea name="message" required />

      {/* Honeypot: bots fill this in, humans never see it */}
      <input type="text" name="_hp" tabIndex={-1} autoComplete="off" style={{ display: 'none' }} />

      <button type="submit">Send</button>
    </form>
  );
}

Good to know

No Supabase Edge Function needed

Lovable often reaches for a Supabase Edge Function plus a transactional email provider key for "send an email" features. PostTo replaces all of that — the fetch call above is the entire integration, and it works whether or not your project uses Supabase for anything else.

Token only — never signed mode here

This request runs client-side in the shipped React bundle, so use the plain endpoint URL with its token. Never enable signed mode for a browser-side integration — the HMAC secret would ship inside your app's JavaScript, visible to anyone.

Spam protection is already wired in

The hidden _hp field is a honeypot — humans never see it, bots fill it in, and PostTo silently discards those submissions. Server-side baseline filtering (heuristics and optional AI classification) runs on every submission after that, so you don't need a CAPTCHA to start.

Frequently asked questions

Can I just tell Lovable to add this instead of editing code myself?: Yes — paste the prompt above into Lovable's chat with your endpoint URL swapped in. Lovable treats it like any other feature request and rewires the existing submit handler.
Does this conflict with Lovable's Supabase integration?: No. If your project already uses Supabase for auth or data, that's unaffected — PostTo only replaces the "send this form as an email" piece, which otherwise would need its own Edge Function.
Will this survive a Lovable redeploy or GitHub sync?: Yes — it's a plain fetch call inside your component code, so it persists through redeploys, GitHub sync, and further edits the same as any other code Lovable writes.
What does it cost?: The free plan includes 50 submissions per month with the full dashboard — no credit card required. Paid plans start at $9/month.

Add a working form to your Lovable app today

Create an endpoint, paste the prompt, and see your first submission in the dashboard — all on the free plan.

Try PostTo free