Tailwind is a CSS framework that offers a wide range of utility classes for building custom user interfaces. By default, Tailwind comes with a default configuration that defines colors, fonts, spacing, and other elements. However, sometimes users may want to disable the default configuration and or use a different preset as a base. A preset is a regular Tailwind configuration object that can contain all the options, such as theme overrides and extensions, adding plugins, and so on.
This article will explain the method to disable the preset default configuration in Tailwind.
How to Disable the Preset Default Configuration in Tailwind?
To disable the preset default configuration in Tailwind, it is required to add the “presets” section and provide an empty array in the “tailwind.config.js” file.
Check out the below-provided steps for a better understanding:
Step 1: Overview of “preset.js” and “tailwind.config.js” Files
In the below screenshot, it can be seen that there is a “preset.js” file which is added to the “tailwind.config.js” file:
Step 2: View Configured Presets in HTML Program
In the below HTML file, the highlighted part shows the configured presets used in the HTML program:
Step 3: Output of HTML Program With Preset
The below web page shows the used preset in the HTML program:
Step 4: Disable Preset Default Configuration
To disable the preset default configuration, provide an empty array to “presets” in the “tailwind.config.js” file:
content: ["./index.html"],
presets: [],
};
This has disabled the preset default configuration.
Step 5: Verify Output
To verify whether the preset has been disabled or not, view the HTML web page:
It can be observed that the preset has been disabled successfully.
Conclusion
To disable the preset default configuration in Tailwind, open the “tailwind.config.js” file, add the “presets” section, and provide it an empty array. Next, save the changes and view the HTML web page for verification. This write-up has demonstrated the step-by-step procedure to disable the preset default configuration in Tailwind.
