Tailwind Config Generator
Generate a basic tailwind.config.js with content globs and dark mode setting.
Last reviewed by the Radiatus Cloud team
Output
Need this built for your product?
We design, build & host secure software & APIs.
Generate a Tailwind config
Setting up Tailwind means creating a config file with the right content paths and options. This generator produces a basic tailwind.config.js with content globs and a dark mode setting, so you start from a correct configuration.
Why the config matters
Tailwind scans your files to find which utility classes you use, and the content globs tell it where to look; get them wrong and classes are missing from the build or the output is bloated. The dark mode setting determines how dark variants work. A generated config with sensible content paths and your chosen dark mode approach gives a working starting point, avoiding the common setup mistakes, empty styles because the content paths missed your files, that trip people up when configuring Tailwind for the first time.
A correct starting config
It runs entirely in your browser, so nothing you paste is uploaded and the result is yours to copy straight into a project, which lets you work on private code and data without anything leaving your machine.
Related tools
- JSON Formatter — Format and beautify JSON in your browser. Pinpoints syntax errors by line and column, flags unsafe integers, and never uploads your data to a server.
- JSON Validator — Validate JSON syntax with precise line and column errors, and check documents against a JSON Schema. Runs locally in your browser, nothing uploaded.
- Regex Tester — Test regular expressions against sample text with live match highlighting, capture groups and flag control. Runs entirely in your browser.
- HTML Minifier — Minify HTML by removing comments and redundant whitespace, without breaking inline elements or pre blocks. Runs entirely in your browser.
Frequently Asked Questions
What do the content globs do?
They tell Tailwind which files to scan for the utility classes you use, so only the classes you need end up in the build.
Why do wrong content paths cause problems?
Because if they miss your files, the classes you use are not found and your styles come out empty, a common and confusing setup mistake.
What is the dark mode setting?
It controls how dark variants are activated, by a class or the system preference, determining how your dark styles work.
Is the config complete?
It is a correct starting point with content paths and dark mode; extend it with your theme customisations and plugins as needed.
Is my input uploaded?
No. The generation runs entirely in your browser.
Privacy & Security
Generated locally in your browser. No data is sent to any server.
How to Use
Enter content globs and dark mode preference to generate tailwind.config.js.
Disclaimer: This tool is provided "as is" without warranty of any kind. Results are for educational and utility purposes.
Related Tools
JSON Formatter
DeveloperFormat and beautify JSON in your browser. Pinpoints syntax errors by line and column, flags unsafe integers, and never uploads your data to a server.
JSON Validator
DeveloperValidate JSON syntax with precise line and column errors, and check documents against a JSON Schema. Runs locally in your browser, nothing uploaded.
Regex Tester
DeveloperTest regular expressions against sample text with live match highlighting, capture groups and flag control. Runs entirely in your browser.