Skip to content

## HTML ​

Wraps the email document with a root element

## 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 styles where needed.

jsx

    import { Button, Html } from 'jsx-email';

    const Email = () => {
      return (
        <Html lang="en" dir="ltr">
          <Button href="https://example.com" style={{ color: '#61dafb' }}>
            Click me
          </Button>
        </Html>
      );
    };

    import { Button, Html } from 'jsx-email';

    const Email = () => {
      return (
        <Html lang="en" dir="ltr">
          <Button href="https://example.com" style={{ color: '#61dafb' }}>
            Click me
          </Button>
        </Html>
      );
    };

## Component Props ​

ts

    lang?: string;

    lang?: string;

Identify the language of text content on the email

ts

    dir?: string;

    dir?: string;

Identify the direction of text content on the email

TIP

This component also expresses all of the Common Component Props for `ComponentProps<'html'>`.