> ## Documentation Index
> Fetch the complete documentation index at: https://fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Send email notifications with SendGrid

> Notify respondents after they submit your Fillout form with customizable emails that can include dynamic data. Add or update their existing contact information.

## What is SendGrid?

[**SendGrid**](https://sendgrid.com/) is a service that helps websites and apps send emails to their users. It is handy for businesses and developers who want a reliable way to send emails, like signup confirmations or newsletters, to their users.

## How it works

<Steps>
  <Step title="Link your Fillout form to SendGrid">
    Open your form. Click `Integrate` from top followed by `SendGrid`.

    <img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/iDs8lNUK7TJTojmP/images/Screenshot2025-11-17at4.48.40PM.png?fit=max&auto=format&n=iDs8lNUK7TJTojmP&q=85&s=409f1b7856d41c08890036d77c71b154" alt="Screenshot 2025-11-17 at 4.48.40 PM.png" width="2617" height="1435" data-path="images/Screenshot2025-11-17at4.48.40PM.png" />

    Enter your **API Key** in Fillout. You can find this in the **Settings** section of your SendGrid dashboard. `Create API Key` on the upper right corner. Enter a **Name**, then go with the default `Full Access` permission.

    <img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/EDZ5NrQNXN0RrO9B/images/Screenshot2025-02-17at1.35.31PM.png?fit=max&auto=format&n=EDZ5NrQNXN0RrO9B&q=85&s=7157ce5e98ccd3f33a42db4365e149bb" alt="Screenshot of the Fillout form creation page" width="1749" height="1222" data-path="images/Screenshot2025-02-17at1.35.31PM.png" />
  </Step>

  <Step title="Choose to send email with template">
    If you don’t have a template on SendGrid yet, select `Email API` on the left-hand panel followed by `Dynamic Templates` and `Create Dynamic Template`.

    <img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/iDs8lNUK7TJTojmP/images/Screenshot2025-11-17at4.58.43PM.png?fit=max&auto=format&n=iDs8lNUK7TJTojmP&q=85&s=2901c5f1e6a8b58fa4c7b077b0e649d4" alt="Screenshot 2025-11-17 at 4.58.43 PM.png" width="2527" height="600" data-path="images/Screenshot2025-11-17at4.58.43PM.png" />

    Click `Add Version` and start with a **blank template** or choose a **SendGrid Email Design**. Customize your email template as you see fit.

    <img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/iDs8lNUK7TJTojmP/images/Screenshot2025-11-17at5.00.32PM.png?fit=max&auto=format&n=iDs8lNUK7TJTojmP&q=85&s=d47517fe345055118cc381a971e5b984" alt="Screenshot 2025-11-17 at 5.00.32 PM.png" width="2074" height="834" data-path="images/Screenshot2025-11-17at5.00.32PM.png" />
  </Step>

  <Step title="Map your form fields">
    On Fillout, [link your form fields](https://www.fillout.com/help/additional-integration-mappings#how-to-map-fields-manually) to the corresponding fields in your SendGrid contacts. For example, link the email address to its respective field. Then, fill out the **Sender identity** section.

    <img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/EDZ5NrQNXN0RrO9B/images/Screenshot2025-02-17at1.45.33PM.png?fit=max&auto=format&n=EDZ5NrQNXN0RrO9B&q=85&s=1935353079395d018aa1d9f773e6fee2" alt="Screenshot of the Fillout form creation page" width="2662" height="1415" data-path="images/Screenshot2025-02-17at1.45.33PM.png" />

    You can personalize emails, by inserting dynamic data under **Template variables**. For example, we want the "Name" to change depending on the customer’s name. Once everything is set, click `Finish setup`.
  </Step>

  <Step title="Publish and share">
    Once you’ve finished creating your form, you’re ready to go! Simply `Publish` and share the link. Respondents will now receive the email template.

    <Check>
      SendGrid's Free plan lets you send up to 100 emails per day, while the Essentials paid plan lets you send up to 50,000 emails per month.
    </Check>
  </Step>
</Steps>

## Send a freeform email

You can also send a plain custom-formatted email by choosing `Send email without template` and entering the recipient and sender details. [Reference form fields](https://www.fillout.com/help/additional-integration-mappings#how-to-map-fields-manually) by clicking <Icon icon="square-plus" iconType="solid" /> or typing **@**.

<img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/EDZ5NrQNXN0RrO9B/images/Screenshot2025-02-17at1.57.16PM.png?fit=max&auto=format&n=EDZ5NrQNXN0RrO9B&q=85&s=6a9ba132f6e148500015c89927acb945" alt="Screenshot of the Fillout form creation page" width="2057" height="782" data-path="images/Screenshot2025-02-17at1.57.16PM.png" />

## Add or update contact information

Skip sending an email and simply `Add or update contact`. Choose a **List** in your SendGrid account. Then, link the **Email address field** and `+ Add new` **Contact fields** as you see fit. [Map](https://www.fillout.com/help/additional-integration-mappings#how-to-map-fields-manually) the SendGrid fields on the left to their respective Fillout fields on the right.

<img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/EDZ5NrQNXN0RrO9B/images/Screenshot2025-02-17at1.58.32PM.png?fit=max&auto=format&n=EDZ5NrQNXN0RrO9B&q=85&s=9d45fe80cf8762a9563fe0d18020ce3e" alt="Screenshot of the Fillout form creation page" width="2054" height="848" data-path="images/Screenshot2025-02-17at1.58.32PM.png" />

## Specify a condition

If necessary, you can run your integration only when a specific condition is met. Click [here](/conditional-integration) to learn how to.

## Personalize your email in Sendgrid

You can use **handlebars** in Sendgrid to [pipe a respondent's information](https://docs.sendgrid.com/for-developers/sending-email/using-handlebars) in the notification email. For example, we'll personalize the email by adding the respondent's name. Simply type `{{ name }}` anywhere on your email.

<img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/EDZ5NrQNXN0RrO9B/images/Screenshot2025-02-17at2.02.23PM.png?fit=max&auto=format&n=EDZ5NrQNXN0RrO9B&q=85&s=bb9440f202a9b3fc9f412371ddec2f4a" alt="Screenshot of the Fillout form creation page" width="1931" height="1095" data-path="images/Screenshot2025-02-17at2.02.23PM.png" />

When a respondent completes your form, they will be receiving a personalized email like the one below.

<img src="https://mintcdn.com/fillout-005a867b-dependabot-npm-and-yarn-form-data-4-0-6/I3fiDV8Zp-JLqtEx/images/ScreenShot2023-10-09at4.51.44PM.png?fit=max&auto=format&n=I3fiDV8Zp-JLqtEx&q=85&s=4f1083a59d4f668d5549cde7b790405b" alt="Screenshot of the Fillout form creation page" width="871" height="509" data-path="images/ScreenShot2023-10-09at4.51.44PM.png" />

## Related articles

<CardGroup cols={3}>
  <Card title="Integration logic" icon="gear-complex" iconType="regular" color="#FFC738" href="/conditional-integration">
    Perform an integration only when a certain condition is met.
  </Card>

  <Card title="Calculations" icon="calculator-simple" iconType="regular" color="#FFC738" href="/calculations">
    Calculate prices for order forms, compute quiz scores, and more.
  </Card>

  <Card title="Send messages with Twilio" icon="message-sms" iconType="regular" color="#FFC738" href="/twilio">
    Automate SMS updates to customers.
  </Card>
</CardGroup>
