Keep class usage intentional, minimize extra plugins, avoid unnecessary custom layers, and monitor build output.
Tailwind CSS Interview Questions
Create reusable primitives (Button/Card/Input) that encapsulate stable utility patterns.
Migrate per component, preserve behavior first, then simplify with shared utility abstractions.
Wrap with scoped parent class and use prose/plugin utilities or minimal scoped CSS overrides as needed.
Use semantic variant names (
primary,secondary,ghost,danger) mapped to explicit class sets.Centralize state classes (
opacity,cursor,pointer-events) in component variants for consistency.Define one reusable focus-ring token pattern and apply it to all interactive components.
Build/test light and dark classes together in each component, not as later patchwork.
Adopt linting/formatting, shared component libraries, design review gates, and documented class patterns.
Question 55
What is tailwind-merge used for?
It resolves conflicting utility classes when composing class lists dynamically.
For truly dynamic values not representable statically and not worth adding as reusable token.
Use visual regression snapshots plus responsive and interaction state checks.
Map raw palette tokens to semantic roles (
--color-success-bg) so design changes do not require class rewrites everywhere.Stay on predefined spacing scale and reserve arbitrary spacing for proven special cases only.
Use meaningful motion only, keep durations short, and provide reduced-motion fallbacks.