Tailwind is the Worst of All Worlds21 July 2025React,CSS,Tailwind,HTMLTailwind is the worst of all worlds. Tailwind classes are generated dynamically outside of your purview by the bundler and thus make it even harder to understand who will win a specificity conflict. Consider the following simple example with plain CSS:.todo-item { color : var ( --warning-color ) ; background : blue ; }< div className = ' todo ' > 1 </ div > < div className = ' todo ' > 2 </ div > < div className = ' todo ' > 3 </ div >And this one with tailwind:// CSS (Generated by Tailwind) .text-warning { color : #ffcc00 ; } bg-blue: { background : blue ; }< div className = ' text-warning bg-blue ' > 1 </ div > < div className = ' text-warning bg-blue ' > 2 </ div > < div className = ' text-warning bg-blue ' > 3 </ div >In this simple but common example, tailwind generates a larger CSS bundle and a larger JS bundle! Okay, so why does everyone use tailwind if it's the worst of all worlds? My point is to say that Tailwind is the worst of all worlds.