Skip to content
AI builder guide

Add a contact form to a v0 project

v0 generates Next.js components and tends to add a server action or an API route for any form. This prompt points the form at Formwire instead, so there is nothing to deploy behind it.

4 min read

The prompt

Replace YOUR-ACCESS-KEY with the key from your form's page, then paste the prompt into v0.

The prompt

            1
            Add a contact form to the site with name, email and message fields.
          
            2
            Make it a plain HTML form that posts to Formwire: set the form's action
          
            3
            to https://formwire.io/submit with method POST, and add a hidden
          
            4
            input named access_key with the value YOUR-ACCESS-KEY.
          
            5
            Add a hidden input named redirect with the URL of a thank-you page, and
          
            6
            a text input named fax that is hidden with CSS and left empty.
          
            7
            Do not add any JavaScript submit handler, API route or Next.js API route or server action backend
          
            8
            function for the form. Integration reference: https://formwire.com/llms.txt
          

Steps

  1. 1

    Create a form and copy its access key

    Sign up at app.formwire.com and create a form. Your sign-in address receives its submissions from the start. The access key is on the form's Settings tab, under General.

  2. 2

    Paste the prompt into v0

    Put your access key in place of YOUR-ACCESS-KEY and paste the prompt into the chat. The prompt tells the generator to leave the form as plain HTML, which is what stops it inventing a backend route or a fake success message.

  3. 3

    Check the generated form

    Open the generated code and check three things: the form's action is https://formwire.io/submit, there is a hidden input named access_key with your key, and the submit button is inside the form. Generators most often change the field name or wrap the form in their own submit handler.

  4. 4

    Send a test submission

    Open the preview, fill the form in and send it. The submission appears in the form's inbox in the dashboard within a few seconds and the notification email follows, with Reply-To set to the address the visitor typed.

Notes for v0

  • v0 writes shadcn/ui forms with react-hook-form. If it does, the submit handler should build FormData or JSON and post to the endpoint with access_key; the Next.js guide shows the shape.
  • Deploying to Vercel adds nothing: no function or environment variable is needed, though the key can live in NEXT_PUBLIC_FORMWIRE_KEY if you prefer.
  • If v0 adds an onSubmit handler that calls preventDefault, the form never reaches Formwire. Ask it to remove the handler, or have it post with fetch to the same endpoint and read the JSON response.
  • A fake thank-you message with nothing in the inbox means the POST never left the page. Check the inbox before debugging anything else; if the POST arrived, it is listed there with its delivery status.
  • v0 may regenerate the form on later prompts. Re-check the action and the access_key field after any change to that page, or ask for the form to be left as it is.
  • Claude Code and Cursor can create the form for you over MCP: add https://mcp.formwire.com/mcp as a server, sign in, and ask for a contact form for your domain.

Questions

Why does v0 say the form was sent when nothing arrives?

The generator wrote a success state without a request behind it, or changed the action URL or the access_key field. Open the form's inbox: if the submission is there, delivery is the problem; if it is not, the POST never happened and the form markup needs checking.

Is the access key safe to put in client-side code?

Yes. The access key is a public ID that can only deliver submissions to the inbox you verified. It cannot read submissions or change settings, and you can rotate it from the form's settings if it is ever abused.

How does the form stop spam without a captcha?

The hidden fax field is a honeypot: a submission that fills it in goes to the Spam folder and nobody is emailed. A spam filter and rate limits also run on every form. Settings, Spam & security has the filter level, and on Pro, allowed domains.

Where do submissions go?

Each submission is stored in the form's inbox in the dashboard and emailed to you with Reply-To set to the visitor. On Pro it can also go to more recipients and to webhooks. The inbox exports to CSV and JSON.

All guides