---
canonical_url: "https://nuxtemail.com"
---
<the-gradient>



</the-gradient>

<u-page-hero>

![Test](https://nuxtemail.com/promo.png)<template v-slot:title="">

Email Template Rendering for your <span className="text-primary">

Nuxt Apps

</span>
</template>

<template v-slot:description="">

Plug-and-play email template rendering using Vue components. Create beautiful HTML emails with the power of Vue and modern development workflow.

</template>

<template v-slot:links="">
<u-button size="xl" to="https://nuxtemail.com/getting-started/installation" icon="i-ph-rocket-launch-duotone">

Get started

</u-button>

<copy-code-input source="npx nuxt module add nuxt-email-renderer">



</copy-code-input>
</template>
</u-page-hero>

<u-page-section>
<template v-slot:title="">

Create stunning emails with <br />

 <span className="text-primary">

Vue components

</span>
</template>

<template v-slot:features="">
<u-page-card :spotlight="true" icon="i-ph-envelope-duotone">



</u-page-card>
</template>

<template v-slot:title="">

Vue-Powered Templates

</template>

<template v-slot:description="">

Build email templates using Vue components with full TypeScript support and modern development experience.
:::

<u-page-card :spotlight="true" icon="i-ph-code-duotone">



</u-page-card>
</template>

<template v-slot:title="">

Pre-built Components

</template>

<template v-slot:description="">

Use a collection of email-optimized Vue components designed for maximum compatibility across email clients.
:::

<u-page-card :spotlight="true" icon="i-ph-device-mobile-duotone">



</u-page-card>
</template>

<template v-slot:title="">

Responsive Design

</template>

<template v-slot:description="">

Create responsive email layouts that look great on desktop, mobile, and tablet devices.
:::

<u-page-card :spotlight="true" icon="i-ph-globe">



</u-page-card>
</template>

<template v-slot:title="">

Internationalization (i18n)

</template>

<template v-slot:description="">

Easily create multilingual email templates with built-in i18n support when using `@nuxtjs/i18n`.
:::

<u-page-card :spotlight="true" icon="i-ph-browser-duotone">



</u-page-card>
</template>

<template v-slot:title="">

Live Preview

</template>

<template v-slot:description="">

Preview your email templates in real-time during development with built-in rendering and testing tools.
:::

<u-page-card :spotlight="true" icon="i-ph-rocket-launch-duotone">



</u-page-card>
</template>

<template v-slot:title="">

Easy Integration

</template>

<template v-slot:description="">

Integrate seamlessly with your existing Nuxt application and email service providers for streamlined email delivery.
:::

</template>
</u-page-section>

<u-page-section>
<template v-slot:title="">

Trusted by Leading Tools in <br />

 <span className="text-primary">

Production

</span>
</template>

<template v-slot:links="">
<u-button size="xl" to="https://weekly-vue.news" color="neutral" target="_blank" trailing-icon="i-ph-arrow-right" variant="outline">

Weekly Vue Newsletter

</u-button>

<u-button size="xl" to="https://nuxtstarterkit.com" color="neutral" target="_blank" trailing-icon="i-ph-arrow-right" variant="outline">

Nuxt Starter Kit

</u-button>
</template>
</u-page-section>

## Resources for Agents

- [API catalog: every service document this site publishes](https://nuxtemail.com/.well-known/api-catalog)
- [Sitemap (XML)](https://nuxtemail.com/sitemap.xml)
- [Sitemap (Markdown): every page on the site](https://nuxtemail.com/sitemap.md)
- [MCP server card: MCP endpoint at https://nuxtemail.com/mcp](https://nuxtemail.com/.well-known/mcp/server-card.json)
- [MCP endpoint (streamable HTTP)](https://nuxtemail.com/mcp)
- [llms.txt: index of the documentation for LLMs](https://nuxtemail.com/llms.txt)
- [llms-full.txt: the full documentation as a single file](https://nuxtemail.com/llms-full.txt)
- [OpenAPI document: every route this site serves to agents](https://nuxtemail.com/openapi.json)


## Sitemap

See the full [sitemap](https://nuxtemail.com/sitemap.md) for all pages.