# v0 contact form that sends email

> Make the form on your v0 site send real email with FormDoc: why AI-built forms don’t send, a ready prompt for v0, and how to test it.

To make a form on a v0 site send email, point it at FormDoc: paste the prompt below into v0 with your free access key, and every submission is emailed to you. No backend, database or API keys are needed.

v0, by Vercel, generates React and Next.js interfaces from a prompt, styled with Tailwind CSS and shadcn/ui, and can deploy them to Vercel.

## Why the form on your v0 site doesn’t send

v0 often wires a contact form to a Next.js Server Action or an API route that logs the message, or to nothing at all. Unless you add an email service and its keys, nothing reaches your inbox. Sending the form to FormDoc works in any v0 project, including static exports.

## Fix it with one prompt

1.  Get a free access key at [app.formdoc.dev/new](https://app.formdoc.dev/new) and confirm your email.
2.  Copy the prompt and replace `YOUR_ACCESS_KEY` with your key.
3.  Paste it into v0, let it update the form, then publish.

TEXT

```text
Add a contact form to the Contact page that sends every submission to my email using FormDoc, a form backend (no server code or API route needed).

Fields:
- Name (required): name="name"
- Email (required): name="email"
- Message (required): name="message"

Requirements:
1. Build it as a real <form> element in this app.
2. Every field needs a name attribute exactly as listed, a visible <label>, and the required attribute. Use type="email" for the email field.
3. Inside the form add <input type="hidden" name="access_key" value="YOUR_ACCESS_KEY">.
4. Add a hidden spam trap: a checkbox named "botcheck", hidden with display:none, tabindex -1 and autocomplete off.
5. On submit, prevent the page reload and POST new FormData(form) to https://api.formdoc.dev/v1/submit with the header "Accept: application/json". Don't set Content-Type yourself.
6. While sending, disable the button and show "Sending…".
7. If the JSON response has success: true, reset the form and show "Thanks! Your message was sent." Otherwise show error.message from the response and keep what the visitor typed.
8. Match the existing design and components.

Don't fake success with console.log, setTimeout or alert, don't use mailto:, and don't create a backend route or server function: FormDoc receives the form and emails me.
```

Want a different form, such as a quote request or a booking? The [AI form prompt generator](https://www.formdoc.dev/tools/ai-form-prompt-generator/) writes this prompt for any form and fields.

You don’t need a Server Action or API route for the form. Send it straight from the browser to FormDoc with fetch, as the prompt below asks.

## What changes, and why

| What the AI often writes | What works with FormDoc |
| --- | --- |
| A submit handler that logs the data or waits, then shows “Thanks!” | A real request to FormDoc, with success shown only when it worked |
| Inputs held in React state without a name | Every field has a name, which becomes its label in your email |
| A backend route or function you have to host | No server code: the browser sends the form to FormDoc |
| No spam protection | A hidden honeypot, plus FormDoc’s spam scoring and rate limits |

## Test it

Publish the site, send yourself a message and check your inbox. If nothing arrives:

-   Make sure you confirmed your email address when you got the key. Until then, submissions are refused.
-   Paste the form’s code into the [AI form checker](https://www.formdoc.dev/tools/ai-form-checker/): it lists exactly what’s missing and writes a prompt to fix it.
-   Open your browser’s developer tools and look at the request to `api.formdoc.dev`: the JSON response explains any error.

For the general version of this guide, see [forms on AI-built websites](https://www.formdoc.dev/docs/ai-builders/), and for the full story read [why your AI-built form isn’t sending emails](https://www.formdoc.dev/blog/ai-built-form-not-sending/).

## Common questions

### Do I need a backend or database for the form?

No. FormDoc receives the form, filters spam and emails it to you. Your v0 project only needs the form itself.

### Will this change how my site looks?

No. The prompt asks v0 to keep the existing design and components and only change how the form submits.

### Is the access key safe to put in the code?

Yes. It’s public by design: it only lets people send you submissions, and it can’t read anything.

### How many submissions are free?

The Free plan includes 250 submissions a month, with spam protection and email notifications. See [pricing](https://www.formdoc.dev/pricing/).
