--- section: Presets label: Tailwind CSS package: '@twind/preset-tailwind' playground: true excerpt: | The full [Tailwind CSS](https://tailwindcss.com) v3 experience without any build step right in the browser or any other environment like Node.js, deno, workers, ... next: ./preset-tailwind-forms.md --- ## 🤝 Compatibility | @twind/preset-tailwind | tailwindcss | | ------------------------------- | ----------- | | `>=1.0.0-next.39 <1` | `3.1` | | `>=1.0.0-next.1 <1.0.0-next.39` | `3.0` | ## 📦 Installation **with [@twind/core](https://github.com/tw-in-js/twind/tree/main/packages/core)** Install from npm: ```sh npm install @twind/core @twind/preset-tailwind ``` Add the preset to your twind config: ```js title="twind.config.js" import { defineConfig } from '@twind/core' import presetTailwind from '@twind/preset-tailwind' export default defineConfig({ presets: [presetTailwind(/* options */)], /* config */ }) ```

Usage with a script tag

```html ```

**with [Twind CDN](./installation#twind-cdn)** _Already included in `@twind/cdn`_ ## 🙇 Usage All utilities and variants from [Tailwind CSS](https://tailwindcss.com) are available. ## 🔧 Options This preset can be configured with the following options: - `disablePreflight: boolean` — allows to disable the [preflight](https://tailwindcss.com/docs/preflight)