Skip to main content
Contains head components such as style and meta elements. This component automatically includes essential meta tags for email rendering.

​
Installation

npm install @react-email/head -E

​
Usage

Add the component to your email template. Include children tags where needed. 
import { Head } from "@react-email/head";

const Email = () => {
  return (
    <Head>
      <title>My email title</title>
    </Head>
  );
};

​
Props

The Head component accepts all standard HTML attributes for the <head> element.
​
children
ReactNode
The content to place in the head element, such as <title>, <style>, <meta>, and <Font> components

​
Features

The Head component automatically includes the following meta tags:
  • <meta content="text/html; charset=UTF-8" httpEquiv="Content-Type" /> - Sets the character encoding
  • <meta name="x-apple-disable-message-reformatting" /> - Prevents Apple Mail from reformatting your email

​
TypeScript

export type HeadProps = Readonly<React.ComponentPropsWithoutRef<'head'>>;

​
Email Client Support

This component was tested using the most popular email clients.
GmailApple MailOutlookYahoo! MailHEYSuperhuman
✔✔✔✔✔✔

Build docs developers (and LLMs) love

Get started for freeTalk to us