import { Tabs, TabItem } from '@astrojs/starlight/components'
This guide shows how to create a minimal email template and render it to HTML and plain text.
## Installation
Install the core package:
```sh
npm i hono-email
```
```sh
yarn add hono-email
```
```sh
pnpm add hono-email
```
```sh
bun i hono-email
```
## Write a template
Create a JSX component that uses the email primitives from `hono-email`:
```tsx
import { Body, Button, Container, Head, Heading, Html, Preview, Text, render } from 'hono-email'
export default function WelcomeEmail() {
return (
WelcomeYour account is ready.WelcomeThanks for signing up.
)
}
```
## Render it
Call `render()` with the component to get HTML, plain text, and any warnings:
```tsx
const { html, text, warnings } = await render(, {
text: {
headingStyle: 'preserve',
linkFormat: 'text-only',
},
})
```
- `html` — the final HTML email body.
- `text` — the plain-text version derived from the same JSX tree.
- `warnings` — compatibility warnings collected during rendering.
Strict mode is enabled by default. If the JSX contains markup or CSS that is risky for email clients, `render()` throws or warns depending on the configuration.
## Next steps
- Learn more about the [`render()` API](/core/render/).
- Explore the available [components](/components/document-structure/).
- Send the output through an [adapter](/adapters/smtp/).