CSS is one of those things that looks simple, until you actually try to reason about it. Most people consider CSS an easy language to learn, yet so...
For further actions, you may consider blocking this person and/or reporting abuse
Also, another factor is code generators are built on language models, which are notoriously poor at spatiotemporal reasoning and CSS visual layout is fundamentally a spatial task. LLMs can semantically explain positioning, cascading, and even animation concepts and a lot of times can generate syntactically correct code. Interestingly, they can often instruct you through layout problems step-by-step, but struggle to successfully execute the same task autonomously.
But that frequent execution failure is because they’re not actually reasoning about spatial relationships or temporal sequences… they’re pattern-matching on training data. And it’s not a ‘pattern matching isn’t reasoning’ thing. It’s that their pattern-matching based reasoning is based in a completely symbolic space so that gap between explanation and execution reveals the limitation that semantic understanding without spatial/temporal modeling. It’s like asking a landscape artist who’s face-blind to paint a portrait.
Tailwind helps by collapsing the semantic-spatial gap - utility classes create tighter coupling between “what you write” and “what appears,” reducing the reasoning distance the model has to traverse.
That's an interesting point of view, Thanks for sharing.
Stealing this quote from you for later use:"It’s like asking a landscape artist who’s face-blind to paint a portrait."
Feel free, I'm glad you liked it!
This post combined with Dead framework theory makes me scared for the future of website development.
At what time creative developers are just going to stop thinking about new solutions, because they are forced to use technology that has be become so ubiquitous it is not possible to it another way.
Using Tailwind is a very extreme way of doing CSS things. Making everything a utility class is like creating everything out of lego. Do you use it to build vehicles or buildings, yes for the novelty but in the end you do want a sturdier building material if you want it to last.
I'm not going to deny CSS is strange and people have to find their own way to use it. But CSS is the art of the website. It is fun to color in an already drawn Mona Lisa, but if you know what techniques are used to create the real thing you will understand it is a skill you can master in.
Sure redesigns happen regularly, but with Tailwind you have to start from scratch every time, because that is how utility classes work.
If AI doesn't understand CSS, then it is not the right tool to use. Don't rely on your tool to come up with solutions for you. You don't use a hamer to install windows.
Great read! The way you compared CSS’s context to how AI interprets it makes total sense.
Informative Broski....
helpful 🫡
I liked the images, and the information about CSS is really helpful.
Absolutely nailed it. CSS looks simple on the surface, but reasoning about layout, stacking contexts, and cascades is anything but. Tailwind works so well with LLMs precisely because it turns those implicit relationships into explicit, composable utilities. It’s like giving the AI a clear API for styling.
In my experience, generative AI has been fine as an assistant when creating CSS. I don't personally use it, but I've played around and seen it work well. It's going to fall down on big, messy, badly-designed projects of course.
It's interesting to think that using Tailwind makes it easier for the assistant to work. I hadn't really thought about that, probably because every "AI" seems to want to use Tailwind by default. It's really common in the examples it plagiarises, so that makes sense.
I don't think it's a terrible idea for examples to be shown that use Tailwind behind the scenes if it makes them easier for the AI to produce. You get your answer, you see a pretty depiction, and you go away and write it properly yourself. However, I don't want to back anything that even indirectly promotes the use of Tailwind, since I consider it to be a step in the wrong direction.
Super interesting read, not just about why CSS is hard for AI, but even more about the peculiarities of CSS, and why it is so complex (and hard to grasp - not the basics of it, but to grasp it at "expert level") ...
This leads me to the question: is CSS fundamentally ill-designed, or "broken", or are we just using it for things (e.g. dynamic web "apps") for which it was never intended and for which it's in fact ill-suited?
Supporting that idea - note that in the mobile app world (iOS, Android), the native UI frameworks do not use CSS, or something which looks like it - they use their own layout and styling frameworks, which aren't like CSS at all ...
Or am I really comparing apples and oranges here, and treating CSS unfairly/wrongly in doing so?
CSS isn't ill-designed or broken, and it's not being used for things for which it wasn't intended, but it is too often used in a way that it wasn't intended. CSS is designed to be written specifically for a given HTML document and in particular the semantics of its content, but often when CSS is written in a style sheet authors mistakenly attempt to abstract this coupling away.
And that is the mistake that you can't really make with Tailwind. Because you're writing the styling directly on the element there's no opportunity for that abstraction and you're forced to style the content that right there in that place, and only that particular content.
Super! The way you broke down how sneaky-complicated CSS actually is and why Tailwind makes life easier for LLMs totally clicked for me.
When using Tailwindcss, I no longer need to think about how to declare class names.
Sure, but that's not very hard to do. Just look at the content of the element, ask yourself "What's that content about?" and make your class name the answer.