> ## Documentation Index
> Fetch the complete documentation index at: https://docs.emailux.com/llms.txt
> Use this file to discover all available pages before exploring further.
# Body component
> Create Body wrapper tag
## 1. Install dependencies
Install the EmailUX Email package locally and a few components.
```bash theme={null}
# pnpm
pnpm add @emailux/components
# npm
npm install @emailux/components
# yarn
yarn add @emailux/components
```
## 2. Usage
```tsx theme={null}
import { Body } from "@emailux/components";
export default function EmailTemplate() {
return
Some title
;
}
```
## Props
| Name | Type | Required | Default | Description |
| ----------------------- | ------------------- | -------- | ------------------------------------------------------------------------ | ---------------------------------------------------------------------------------------------------------------------------------------------------------------- |
| children | React.ReactNode | Yes | — | Content of the email document |
| dir | "ltr" \| "rtl" | No | Comes from wrapping `Html` component's `dir` context prop which is `ltr` | Text direction |
| background | string | Yes | — | — |
| backgroundColor | string | Yes | — | — |
| style | React.CSSProperties | No | - | - |
| width | number or "100%" | No | — | width of container |
| padding | string | No | `12px 20px` | inner padding |
| outerBgColor | string | No | — | When whidth is not `100%` and a number, you can set this value as Hex color value to set the left and right side of the section background color, not the inside |
| borderRadius | string | No | | |
| footer | React.ReactNode | No | | |
| footerWidth | number or "100%" | No | — | width of footer |
| footerPadding | string | No | `0px 20p` | footer padding |
| footerOuterBgColor | string | No | — | |
| footerBackgroundColor | string | No | — | |
| footerStyle | React.CSSProperties | No | - | - |
| backgroundPosition | string | no | "bottom" | when there is background image url this is css property for position |
| backgroundRepeat | string | no | "no-repeat, no-repeat" | when there is background image url this is css property for repeat |
| bgImageTakesAllWrappers | string | no | false | when there is background image url takes all if width is not 100%, but with 100% it already takes all |
| borderWidth | number | No | — | border width of the body |
| borderColor | string | No | — | Border will work if border width is greater than 0 |
| openCounter | boolean | No | `true` | When enabled, appends `` at the end of the body content. This tag has no visual effect on the rendered email. |
All other standard attributes for the `` element are supported.
## Open counter tracking
By default, `Body` appends a `` tag as the last element inside ``. This tag does not affect how the email looks in inboxes and is intended for open-counter tracking in downstream email pipelines.
```tsx theme={null}
// Tracking tag is included by default
...
// Disable the tracking tag
...
```