Skip to content

docs: update installation guide to add tailwind css v4 instructions while keeping v3 details #180

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Open
wants to merge 1 commit into
base: main
Choose a base branch
from
Open
Changes from all commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 18 additions & 1 deletion README.md
Original file line number Diff line number Diff line change
Expand Up @@ -10,7 +10,14 @@ Install the plugin from npm:
npm install -D @tailwindcss/forms
```

Then add the plugin to your `tailwind.config.js` file:
Add the plugin inside your main `style.css` file:

```diff
@import "tailwindcss";
+@plugin "@tailwindcss/forms";
```

If you're still using **Tailwind v3**, add the plugin in your `tailwind.config.js` file:

```js
// tailwind.config.js
Expand Down Expand Up @@ -107,6 +114,16 @@ Although we recommend thinking of this plugin as a "form reset" rather than a co

If generating both the global (base) styles and classes doesn't work well with your project, you can use the `strategy` option to limit the plugin to just one of these approaches.

Configure the plugin in your main `style.css` like this:

```css
@plugin "@tailwindcss/forms" {
strategy: "class", // or "base"
};
```

If you're still using **Tailwind v3**, configure the plugin in your `tailwind.config.js` like this:

```js
// tailwind.config.js
plugins: [
Expand Down