Platform Guide

Cloudflare Pages Contact Form

Add a contact form to a site on Cloudflare Pages

Last updated October 28, 2026

Cloudflare Pages serves static files, so a form needs somewhere to send its data. Instead of writing a Pages Function, point the form at https://api.staticforms.dev/submit with your form's API key in a hidden apiKey field. Static Forms receives each submission and emails it to you. The HTML below works in any Pages project, with or without a build step, and on the free plan.

1. Add the form

contact.html

redirectTo must be a full URL. Use your pages.dev address or your custom domain, and create the thank-you page it points to. The HTML guide lists every field.

2. Using a framework? Put the key in a build variable

If your project builds with React, Vue, Astro or another framework, you can keep the key out of your source and read it at build time.

Add the variable

In your Pages project, open Settings → Environment variables and add the key under the name your framework exposes to the browser, such as VITE_STATIC_FORMS_KEY or PUBLIC_STATIC_FORMS_KEY.

Read it in the form

Use it as the apiKey value, as the React, Vue and Astro guides show.

Redeploy

Build variables are read during the build, so redeploy after adding or changing one.

The form API key is public by design, so it is fine for it to end up in the built HTML or JavaScript.

Cloudflare Turnstile

Turnstile is Cloudflare's CAPTCHA. Static Forms supports it from the Starter plan; on Free, use the honeypot and reCAPTCHA v2. Setup is in the Turnstile guide.

3. Deploy and test

Push or upload the site, open the contact page on its pages.dev or custom domain, and send a test message. If it doesn't arrive, see troubleshooting.

FAQ

Does this work on the free plan?

Yes. The snippet only uses Free plan features: 250 submissions every 30 days, 1 form endpoint, email delivery, the built-in spam filter, a honeypot field and reCAPTCHA v2. No credit card is needed.

How do I keep spam out?

Every submission is checked by the built-in spam filter on every plan. The snippet adds a hidden honeypot field (any field whose name contains "honeypot"); bots fill it in and those submissions are dropped. reCAPTCHA v2 is available on Free. Cloudflare Turnstile, hCaptcha, ALTCHA and reCAPTCHA v3 are available from the Starter plan.

Is it safe to put the API key in my HTML?

Yes. The form API key is meant to be public. It cannot read your submissions or sign in to your dashboard. From the Starter plan you can also restrict submissions to your own domains.