Skip to content

## Head ​

A JSX email component which creates an HTML head element

TIP

This component is required for adding elements such as `<style>` and `meta` directly to the document

## Install ​

Install the component from your command line

pnpmbunnpmyarn
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'>`.