Skip to main content

enableTailwind()

available from v4.0.256

A function that modifies the default Webpack configuration to make the necessary changes to support TailwindCSS. See the setup to see full instructions on how to setup TailwindCSS in Remotion.

remotion.config.ts
ts
import {Config} from '@remotion/cli/config';
import {enableTailwind} from '@remotion/tailwind-v4';
 
Config.overrideWebpackConfig((currentConfiguration) => {
return enableTailwind(currentConfiguration);
});

Multiple Webpack changes

If you want to make other configuration changes, you can do so by doing them reducer-style:

remotion.config.ts
ts
import {Config} from '@remotion/cli/config';
import {enableTailwind} from '@remotion/tailwind-v4';
 
Config.overrideWebpackConfig((currentConfiguration) => {
return enableTailwind({
...currentConfiguration,
 
// Make other changes
});
});