Getting Started

Set up your first form with StaticForm in under 5 minutes.

View .md
On this page

Overview

StaticForm is a form backend for static websites. You create a form in the dashboard, point your HTML form at the StaticForm API, and submissions are handled for you. That includes validation, spam protection, email notifications, and webhooks.

The StaticForm dashboard

Quick Start

1. Create an Account

Sign up at app.staticform.app. You can create an account with an email and password, or sign in with Google for one-click access.

2. Create a Form

In the dashboard, click Create Form and configure:

  • Name: a label for your form (e.g. “Contact Form”)
  • Fields: the fields your form will accept, with types and validation rules
  • Submit Actions: what happens when someone submits (email, webhook, etc.)

3. Add the Form to Your Website

Point your HTML form at the StaticForm submission endpoint:

<form
  id="contact-form"
  method="POST"
  action="https://api.staticform.app/api/v1/forms/YOUR_FORM_ID"
>
  <input type="text" name="name" required />
  <input type="email" name="email" required />
  <textarea name="message" required></textarea>
  <button type="submit">Send</button>
</form>

Replace YOUR_FORM_ID with the ID from your dashboard.

4. (Optional) Use the JavaScript Helper

For a better user experience with client-side error handling, include the StaticForm script:

<script src="https://staticform.app/scripts/staticform.js" defer></script>
<script>
  document.addEventListener('DOMContentLoaded', () => {
    const form = document.getElementById('contact-form');
    StaticForm.attach(form, {
      endpoint: 'https://api.staticform.app/api/v1/forms/YOUR_FORM_ID',
    });
  });
</script>

The helper prevents the default form submission, sends the data via fetch, and maps validation errors back to individual fields.

What’s Next