@remotion/tailwind

import Tabs from '@theme/Tabs'; import TabItem from '@theme/TabItem'; import {ExperimentalBadge} from '../../components/Experimental'; import {TableOfContents} from './TableOfContents';

:::note This is documentation for enabling Tailwind v3.
For the Tailwind v4 version of this site, see the Tailwind v4 documentation. :::

This package provides utilities useful for integrating TailwindCSS with Remotion, as documented on our TailwindCSS page.

Installation

Install @remotion/tailwind as well as TailwindCSS dependencies.

Override the Webpack config by using enableTailwind().

import {Config} from '@remotion/cli/config';
import {enableTailwind} from '@remotion/tailwind';

Config.overrideWebpackConfig((currentConfiguration) => {
  return enableTailwind(currentConfiguration);
});

Then follow the remaining set up steps from the TailwindCSS page.

APIs