Contact Forms for Svelte Websites
Build a working contact form for your Svelte website. Send Svelte form data to email using API in three simple steps. See example code below. No backend or server code needed.
No Backend Code
You already know! Setting up form backend is pain. Web3Forms works without any Server or backend code.
No Databases
All emails are sent directly to your email address. We never store your form submissions.
Design without Limits
Web3Forms is an API based form backend. We can seamlessly integrate to any custom design or style.
Create Svelte Contact Form
Creating Svelte Contact Form is easy as 1 2 3. Just follow the steps and you’re done.
Step 1: Create Access Key
Access key will be sent to your email address.
Step 2: Create Svelte Form
Use the following code example to create a form inside your Svelte website.
<script>
let status = "";
const handleSubmit = async data => {
status = 'Submitting...'
const formData = new FormData(data.currentTarget)
const object = Object.fromEntries(formData);
const json = JSON.stringify(object);
const response = await fetch("https://api.web3forms.com/submit", {
method: "POST",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
},
body: json
});
const result = await response.json();
if (result.success) {
console.log(result);
status = result.message || "Success"
}
}
</script>
<form on:submit|preventDefault={handleSubmit}>
<input type="hidden" name="access_key" value="YOUR_ACCESS_KEY_HERE">
<input type="text" name="name" required />
<input type="email" name="email" required />
<textarea name="message" required rows="3"></textarea>
<input type="submit" />
</form>
<div>{status}</div>Step 3: Add your Access Key
Replace the access key with your actual key to start receiving email submissions.
<input type="hidden" name="access_key" value="YOUR_ACCESS_KEY_HERE">Get Started!
Create your contact form for static website in minutes.
Create your Access KeyNo Signup required