From 2418f4aded7ec4d004691a9c03dba357c5772cef Mon Sep 17 00:00:00 2001 From: levin too <44953808+levintoo@users.noreply.github.com> Date: Tue, 29 Apr 2025 01:28:50 +0300 Subject: [PATCH] docs(readme): add setup instructions for tailwind v4 --- README.md | 19 ++++++++++++++++++- 1 file changed, 18 insertions(+), 1 deletion(-) diff --git a/README.md b/README.md index d20b50d..478d340 100644 --- a/README.md +++ b/README.md @@ -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 @@ -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: [