# Lovable + Resend Integration: Transactional Email Guide

- Tool: Lovable
- Difficulty: Beginner
- Time required: 20 minutes
- Last updated: September 2026

## TL;DR

Resend is Lovable's native transactional email connector — the recommended way to send email since it went live, alongside built-in 'Lovable Emails' for the simplest cases. Add your Resend API key (starts with re_) via the connector or Cloud → Secrets, verify your sending domain's SPF and DKIM records in Resend, then describe the emails you need in chat. There's no SMTP option; everything runs over Resend's API from an Edge Function.

## Resend is Lovable's native transactional email connector

Resend is the primary way to send email from a Lovable app in 2026. There are two related paths, and it's worth understanding both before you start. 'Lovable Emails' is Lovable's own built-in email feature — it auto-configures DNS, SPF, and DKIM for you and is the fastest setup for standard transactional email like signup confirmations and password resets, with essentially zero configuration. The native Resend connector, covered on this page, is the deeper integration: you bring your own Resend account and API key, and get access to Resend's full platform — a specific verified sending domain you control, marketing/broadcast email in addition to transactional, attachments, tagging, and Resend's own delivery analytics.

Both options work as app connectors (available in your deployed app) and chat connectors (giving Lovable's AI context while you build), which means describing an email feature in plain language produces a working Edge Function using the correct API pattern, rather than a generic email integration you'd need to debug from scratch.

One question that comes up often: 'does Lovable support SMTP?' It does not, and this is deliberate — no email provider is wired up over raw SMTP in Lovable, only API-based services like Resend. This avoids SMTP port-blocking issues common on serverless platforms and keeps credentials out of connection strings. If you're migrating from an older Lovable project that used a manual Supabase Edge Function calling Resend's API with a RESEND_API_KEY secret, that pattern still works today — the native connector is simply the faster path for new projects.

## Before you start

- A Lovable account with at least one project created
- A Resend account (free to create at resend.com — a free tier is available with no credit card required)
- Your Resend API key from Resend Dashboard → API Keys (starts with re_)
- Access to your domain's DNS settings, if you plan to send from a custom domain (required for production; not required for initial testing)

## Step-by-step guide

### 1. Activate the native Resend connector

Resend is available as a native Lovable connector, meaning Lovable's AI has built-in context for generating Resend-specific code — you don't need to hand-write the API calls yourself. Open your project and click the Settings icon in the top-right corner of the editor. Navigate to Connectors, find Resend, and click 'Connect.' This works both as an app connector (available in your deployed app) and a chat connector (giving the AI context while you're building).

Activating the connector tells Lovable's AI that Resend is in scope for this project. When you describe an email feature afterward, Lovable will generate the correct Resend API call pattern, the right Edge Function structure for the Deno runtime, and appropriate error handling — rather than guessing at a generic email integration.

If you don't already have a Resend account, create one for free at resend.com — no credit card is required to start, and the free tier includes a meaningful monthly sending allowance for testing and early-stage use.

**Expected result:** Resend shows as an active connector in Settings → Connectors. No API key is stored yet — that happens in the next step.

### 2. Add your Resend API key in Cloud → Secrets

With the connector activated, store your Resend API key securely. Get your key from Resend Dashboard → API Keys → Create API Key. Choose 'Sending access' if this key will only send email (recommended for most projects), or 'Full access' if you also need to manage domains or audiences programmatically. The key will start with re_.

In Lovable, click the '+' icon next to the Preview label to open the Cloud panel, then click the Secrets tab. Click 'Add new secret' and add:

Name: RESEND_API_KEY — Value: your key (starts with re_)

Secrets are encrypted, accessible only from Edge Functions, and never exposed to client-side code or stored in your GitHub repository. Never paste the API key directly into Lovable's chat — on the Free tier, chat history is publicly visible, and even on paid tiers it risks ending up in your Git commit history.

**Expected result:** RESEND_API_KEY appears in the Cloud → Secrets panel with a masked value. Edge Functions can now access it via Deno.env.get('RESEND_API_KEY').

### 3. Verify your sending domain (SPF and DKIM)

Before you can send email from your own domain (e.g. no-reply@yourapp.com) rather than Resend's shared testing domain, you need to verify domain ownership. Go to Resend Dashboard → Domains → Add Domain and enter your domain. Resend will generate a set of DNS records — typically an SPF TXT record and one or more DKIM CNAME or TXT records.

Add these records at your domain registrar or DNS provider (the same place you manage your custom domain for the Lovable app, if you've connected one). DNS propagation can take anywhere from a few minutes to a few hours. Once propagated, return to Resend Dashboard → Domains and click 'Verify.' The domain should show a green 'Verified' status with checks next to both SPF and DKIM before you rely on it for production sends.

Skipping this step doesn't block you from testing — Resend provides a shared testing domain — but any email sent from an unverified custom domain is far more likely to land in spam, and some receiving mail servers will reject it outright.

**Expected result:** Resend Dashboard → Domains shows your domain as 'Verified' with green checks next to SPF and DKIM records.

### 4. Generate a welcome-email flow using Lovable's chat

With the connector active and your key stored, describe the email feature you need and let Lovable generate the implementation. For a welcome email sent after signup, paste a prompt describing exactly when it should fire and what it should contain.

Lovable will generate an Edge Function that calls the Resend API, wire it to fire after the relevant database event (in this case, a new row in your users or profiles table), and include basic error handling so a failed email send doesn't block the signup flow itself.

```
// supabase/functions/send-welcome-email/index.ts
import { Resend } from 'https://esm.sh/resend@3.2.0';

const resend = new Resend(Deno.env.get('RESEND_API_KEY'));

Deno.serve(async (req) => {
  try {
    const { email, name } = await req.json();

    if (!email) {
      return new Response(JSON.stringify({ error: 'Missing email' }), { status: 400 });
    }

    const { data, error } = await resend.emails.send({
      from: 'Welcome <no-reply@yourapp.com>',
      to: email,
      subject: `Welcome, ${name || 'there'}!`,
      html: `<p>Hi ${name || 'there'},</p><p>Thanks for signing up. We're glad you're here.</p>`,
    });

    if (error) {
      console.error('Resend error:', error);
      return new Response(JSON.stringify({ error: error.message }), { status: 500 });
    }

    return new Response(JSON.stringify({ id: data?.id }), {
      headers: { 'Content-Type': 'application/json' },
    });
  } catch (err) {
    console.error('send-welcome-email error:', err);
    return new Response(JSON.stringify({ error: 'Failed to send email' }), { status: 500 });
  }
});
```

**Expected result:** Lovable generates a send-welcome-email Edge Function using the Resend SDK and wires it into the signup flow. The Code panel shows the new file. Signing up a test user triggers an email visible in Resend Dashboard → Logs.

### 5. Add a contact-form notification using the same connector

The second most common Resend use case is notifying yourself when a visitor submits a contact form — this reuses the same connector and API key, just with a different trigger and recipient. Describe the form fields you're collecting and where the notification should be sent.

This pattern also works for order notifications, support ticket alerts, or any 'notify the team' email — the structure is identical, only the trigger and recipient change.

**Expected result:** The contact form saves to a new contact_submissions table and triggers an Edge Function that emails the submission details to your team inbox via Resend.

### 6. Deploy and verify delivery

Test email flows on your deployed app URL, not just the preview panel — some Edge Function behavior, including environment variable access, is most reliably tested against the live deployment. Click Publish in the top-right corner of the editor.

After deployment, trigger the flow (sign up a test account, or submit the contact form) and check two places for confirmation. In Resend Dashboard → Logs, you'll see every API call made, including the full request payload, delivery status, and any errors returned. In Lovable's Cloud → Logs, you'll see the Edge Function's own execution logs, including any errors thrown before the Resend API was even called — useful for distinguishing 'Resend rejected the email' from 'my Edge Function crashed before sending it.'

**Expected result:** Resend Dashboard → Logs shows a successful delivery (status 'delivered' or 'sent'). The test email arrives in the recipient's inbox, not spam, when sent from a verified domain.

## Best practices

- Verify your sending domain's SPF and DKIM records before any production send — unverified domains are far more likely to land in spam or be rejected outright by receiving mail servers.
- Store your RESEND_API_KEY in Cloud → Secrets, never in source code or Lovable's chat history. Use a 'Sending access' key rather than 'Full access' unless you specifically need to manage domains or audiences via the API.
- Never let a failed email send block a critical user flow like signup or checkout. Wrap Resend calls in try/catch and log failures without throwing errors back to the user-facing action.
- Use Resend's batch send endpoint for anything sending to more than a handful of recipients at once, rather than looping individual send calls — this avoids hitting rate limits unexpectedly.
- Test with Resend's dedicated test address (delivered@resend.dev) or your own inbox during development, and confirm delivery in Resend Dashboard → Logs rather than assuming a 200 response means the email actually arrived.
- Choose Lovable Emails for simple transactional sends where you want zero DNS configuration, and the native Resend connector when you need a specific verified domain, marketing email, or Resend-specific features.
- Include unsubscribe handling for any marketing or broadcast email — Resend supports it, but your application (not Resend) is responsible for honoring unsubscribe requests on future sends.

## Use cases

### Welcome email after signup

Send a branded welcome email automatically whenever a new user completes signup, using the native Resend connector and an Edge Function triggered from your auth flow.

Prompt example:

```
Add a welcome email that sends via the Resend connector whenever a new user signs up. Use the subject 'Welcome, {name}!' with a short friendly HTML body. Trigger it from the signup flow after the user's profile row is created, and make sure a failed email send never blocks signup from completing.
```

### Contact form notification

Notify your team by email whenever a visitor submits a contact form, while also saving the submission to the database as a fallback in case delivery fails.

Prompt example:

```
Add a contact form with fields for name, email, and message. When submitted, send an email via the Resend connector to hello@yourapp.com with the visitor's details, and show a 'Message sent!' confirmation on the page. Store the submission in a contact_submissions table as well, in case the email fails to send.
```

### Diagnose and fix a failed send

When a Resend-powered email isn't arriving, check both Resend's own delivery logs and the Edge Function logs to find whether the failure happened before or after the API call.

Prompt example:

```
The welcome email isn't arriving. Check the send-welcome-email Edge Function logs and the Resend API response, and fix any errors you find — check for a missing or malformed API key, an unverified sending domain, and any validation errors in the request payload.
```

## Troubleshooting

### Emails send successfully (200 response from Resend) but consistently land in the recipient's spam folder

Cause: The sending domain is unverified, or SPF/DKIM records haven't fully propagated yet, so receiving mail servers can't confirm the email's authenticity.

Solution: Go to Resend Dashboard → Domains and confirm your domain shows 'Verified' with green checks on both SPF and DKIM, not just 'Pending.' If records were added recently, allow up to a few hours for DNS propagation before retesting. Avoid sending your first batch of emails from a brand-new domain with no sending history — warm it up with smaller volumes first.

### Edge Function throws a CORS error when calling the Resend API

Cause: The Resend API call is being made directly from client-side (browser) code instead of from an Edge Function — Resend's API, like most third-party APIs with secret keys, is not designed to be called from the browser.

Solution: Move the Resend API call into a Supabase Edge Function (Deno) and call that function from your frontend instead of calling Resend directly. This also keeps your RESEND_API_KEY out of client-side code entirely, which is a security requirement, not just a CORS fix. Prompt Lovable: 'Move the Resend email call from the frontend into an Edge Function, and call the Edge Function from the client instead.'

### Resend returns a 403 error mentioning the sending domain

Cause: You're trying to send from an email address on a domain that hasn't been verified in your Resend account yet (e.g. sending from no-reply@yourapp.com before yourapp.com shows 'Verified' in Resend Dashboard → Domains).

Solution: Either complete domain verification (see Step 3 above) or, for immediate testing, send from Resend's shared onboarding domain instead of your own until DNS verification completes. Update the 'from' address in your Edge Function once your domain is verified.

### API calls fail with a 429 rate-limit error during a bulk send

Cause: Individual send requests are being fired in a tight loop (e.g. one email per recipient in a for-loop) faster than your Resend plan's requests-per-second limit allows.

Solution: Use Resend's batch send endpoint (resend.batch.send()) to send multiple emails in a single API call instead of looping individual sends. For genuinely large sends, add a short delay between batches or implement retry-with-backoff on 429 responses rather than retrying immediately.

### Resend returns a 401 'invalid API key' error even though the key was added correctly

Cause: The RESEND_API_KEY secret name doesn't match exactly what the Edge Function code expects (case-sensitive), or the key was revoked/regenerated in Resend Dashboard after being added to Lovable's Secrets.

Solution: Double-check the exact secret name in Cloud → Secrets matches RESEND_API_KEY (all caps, no typos) and that the Edge Function reads it via Deno.env.get('RESEND_API_KEY') with matching capitalization. If the key was regenerated in Resend, update the value in Cloud → Secrets — old keys stop working immediately once revoked.

## Frequently asked questions

### Does Lovable support SMTP for sending email?

No. Lovable does not offer raw SMTP from the frontend or from Edge Functions — there is no SMTP relay built into the platform. If you're searching for 'lovable smtp,' what you actually want is either the native Resend connector (an API-based email service, covered on this page) or Lovable's own built-in 'Lovable Emails' feature for simple transactional sends. Both work over HTTPS API calls, not SMTP ports, which also avoids the port-blocking issues SMTP often runs into on serverless platforms like the Deno-based Edge Functions Lovable uses.

### What's the difference between the native Resend connector and 'Lovable Emails'?

Lovable Emails is Lovable's own built-in email feature — it automatically configures DNS, SPF, and DKIM records for you and is the fastest path for standard transactional email like signup confirmations and password resets. The native Resend connector is a deeper integration with Resend itself: you bring your own Resend account and API key, and in exchange get access to Resend's full feature set — marketing email, attachments, tagging, cc/bcc/reply-to, and Resend's own analytics dashboard. Choose Resend directly when you need a specific verified sending domain through Resend's tooling or features beyond what Lovable Emails covers; choose Lovable Emails when you want the simplest possible setup for standard transactional mail.

### Why do my Resend emails land in spam?

The most common cause is an unverified or incompletely verified sending domain — if SPF and DKIM records aren't confirmed in your DNS, receiving mail servers have no way to confirm the email actually came from you, and many will route it to spam by default. Check Resend Dashboard → Domains and confirm the domain shows a 'Verified' status with green checks next to both SPF and DKIM, not just 'Pending.' Also avoid sending your first emails from a brand-new domain with no sending history — build up domain reputation gradually rather than sending a large batch on day one.

### Can I send marketing emails and newsletters with the Resend connector, not just transactional email?

Yes. Resend supports both transactional email (order confirmations, password resets, welcome emails) and marketing/broadcast email (newsletters, product updates) through the same API and the same connector. For marketing sends specifically, make sure your prompts to Lovable include unsubscribe link handling and, if you're sending to EU or California-based users, consent tracking — Resend doesn't manage compliance for you, your application logic does.

### How do I test emails without spamming real users?

Use Resend's test mode by sending to Resend's dedicated test addresses (delivered@resend.dev works without hitting any inbox), or point test sends to your own email during development. Check delivery status and full request/response payloads in Resend Dashboard → Logs, which shows every API call your Edge Function or connector made, including any errors, without needing to guess whether an email actually sent.

### What happens if I exceed Resend's rate limits?

Resend returns a 429 status code with a rate-limit error when you exceed your plan's sending rate (requests per second, not total monthly volume). In a Lovable Edge Function, catch this specifically and either queue the request for retry with backoff or, for bulk sends like a newsletter, batch emails using Resend's batch send endpoint instead of firing individual requests in a tight loop — a common cause of hitting rate limits unexpectedly.

### Should I hire a RapidDev developer to set up transactional email in Lovable?

For the standard use cases on this page — welcome emails, contact form notifications, password resets — the native Resend connector plus a few clear prompts is genuinely something a non-technical founder can set up in under an hour. Where it's worth bringing in help is more complex email logic: multi-step drip sequences, deliverability tuning across multiple sending domains, or transactional email tied into a billing/subscription lifecycle. RapidDev builds these kinds of email systems inside Lovable projects regularly if you'd rather not debug deliverability issues yourself.

---

Source: https://www.rapidevelopers.com/lovable-integration/resend
© RapidDev — https://www.rapidevelopers.com/lovable-integration/resend
