Add a Contact Form to Your SvelteKit Site

SvelteKit has built-in form actions, but for a simple contact form you don’t need them. staticq accepts the submission directly — no server-side handler, no +page.server.ts file required.

Code example

Create a route at src/routes/contact/+page.svelte:

<script>
  // No script needed — this is a plain HTML form submission
</script>

<h1>Contact Us</h1>

<form action="https://api.staticq.app/q/your-form-slug" method="POST">
  <label for="name">Name</label>
  <input type="text" id="name" name="name" required />

  <label for="email">Email</label>
  <input type="email" id="email" name="email" required />

  <label for="message">Message</label>
  <textarea id="message" name="message" required></textarea>

  <button type="submit">Send Message</button>
</form>

The form posts directly to staticq. No use:enhance, no +page.server.ts — the browser handles the redirect after submission.

Setup steps

1. Create a form in the staticq dashboard. Name it and configure your notification email.
2. Copy the endpoint — it looks like https://api.staticq.app/q/your-form-slug.
3. Set the form action in your Svelte component to point at the endpoint.
4. Run and test. Start your dev server with npm run dev, submit the form, and check that the submission appears in your dashboard.

Get started

staticq is free to start with — no credit card required. Create your first form and have submissions flowing in minutes. See pricing for plan details.