![React Email Tailwind cover](https://react.email/static/covers/tailwind.png)
@react-email/tailwind
A React component to wrap emails with Tailwind CSS.

Website · Documentation · Twitter
## Install Install component from your command line. #### With yarn ```sh yarn add @react-email/tailwind -E ``` #### With npm ```sh npm install @react-email/tailwind -E ``` ## Getting started Add the component around your email body content. ```jsx import { Button } from "@react-email/button"; import { Tailwind } from "@react-email/tailwind"; const Email = () => { return ( ); }; ``` ## Contributing notes These are some things you will need to keep in mind if you are improving the Tailwind component with things that might influence certain decisions we have made for better email client support that have been made also in the past by other contributors but not documented which ended up causing us to have these problems and need to rediscover the best decisions again. ### The inlining of all styles This is one of the most important because this is not one of the use cases this is the main focus point of using the Tailwind component. The support for defining styles with tags and using [classes is not the best](https://www.caniemail.com/features/html-style/). This though can't be used the same for media queries so we do append the media queries and the class names associated with them on a `