Skip to content

Head

A JSX email component which creates an HTML head element

TIP

This component is required VML in outlook compatibility for adding elements such as <style> and meta directly to the document

Install

Install the component from your command line

console
pnpm add jsx-email
pnpm add jsx-email
console
bun add jsx-email
bun add jsx-email
console
npm add jsx-email
npm add jsx-email
console
yarn add jsx-email
yarn add jsx-email

Usage

Add the component to your email template. Include children tags where needed.

jsx
import { Head } from 'jsx-email';

const Email = () => {
  return (
    <Head>
      <title>My email title</title>
    </Head>
  );
};
import { Head } from 'jsx-email';

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

Component Props

tsx
export interface HeadProps extends BaseProps<'head'> {
  enableFormatDetection?: boolean;
}
export interface HeadProps extends BaseProps<'head'> {
  enableFormatDetection?: boolean;
}
tsx
enableFormatDetection?: boolean;
enableFormatDetection?: boolean;

This is used to disable the format-detection meta (will be useful for some very specific use-cases) Default value is false

TIP

This component expresses all of the Common Component Props for ComponentProps<'head'>.