> ## Documentation Index
> Fetch the complete documentation index at: https://react.email/docs/llms.txt
> Use this file to discover all available pages before exploring further.
# Font
> A React Font component to set your fonts.
## Install
Install component from your command line.
```sh npm theme={"theme":{"light":"github-light","dark":"vesper"}}
npm install react-email -E
```
```sh yarn theme={"theme":{"light":"github-light","dark":"vesper"}}
yarn add react-email -E
```
```sh pnpm theme={"theme":{"light":"github-light","dark":"vesper"}}
pnpm add react-email -E
```
## Getting started
Add the component to your email template. This applies your font to all tags inside your email.
Note, that not all email clients supports web fonts, this is why it is important to configure your `fallbackFontFamily`.
To view all email clients that supports web fonts [see](https://www.caniemail.com/features/css-at-font-face/)
```jsx theme={"theme":{"light":"github-light","dark":"vesper"}}
import { Font, Head, Html } from "react-email";
const Email = () => {
return (
);
};
```
## Props
The font family you want to use. If the webFont property is configured, this
should contain the name of that font
The fallback font family the system should you, if web fonts are not supported
or the chosen font is not installed on the system.
The webFont the supported email client should use
The weight of the font
The style of the font
## Support
All components were tested using the most popular email clients.
Gmail
Apple Mail
Outlook
Yahoo! Mail
HEY
Superhuman