Tailwind CSS interview question · Most asked
How do you set up Tailwind CSS v4 in a project?
Summary
Install tailwindcss with the integration for your build tool (@tailwindcss/vite, @tailwindcss/postcss, or @tailwindcss/cli), and add @import "tailwindcss"; to your main CSS file. Class detection is automatic; there's no required config file.
Longer Answer
For prototypes, the Play CDN script compiles in the browser, but it isn't for production. Projects coming from v3 can keep a JavaScript config with @config.
Key Points
- Vite plugin, PostCSS plugin or CLI.
- @import "tailwindcss".
- Automatic detection.
- Play CDN only for prototypes.
Deep dive: Tailwind CSS Tutorial: Get Started with Tailwind CSS
Explanation
What interviewers look for
Knows v4's simpler setup.
More most-asked Tailwind CSS questions
- How do you customize Tailwind's design tokens in v4?
- Explain Tailwind's responsive design approach.
- How does Tailwind decide which CSS to generate?
- Why doesn't className={`bg-${color}-500`} work, and what should you do instead?
- What is Tailwind CSS and what does 'utility-first' mean?
- What changed in Tailwind CSS v4 compared with v3?
- How do you make Tailwind interfaces accessible?
- What's the difference between flex and grid in Tailwind, and when do you use each?