I’ve been watching LLMs write frontend code for months now. At first, it was impressive—the speed at which they can spin up a hero section or a pricing table is undeniable. But as someone who has spent two decades managing technical debt, I started seeing the same pattern emerging in every codebase: an explosion of 'magic numbers' and structural decay.
If you use AI agents like Claude or Cursor to build your UI, you aren't just inheriting code; you are inheriting a massive amount of unmanaged CSS entropy. You see w-[347px], text-[#e74c3c], and endless nested div elements that look fine on a high-res monitor but completely fall apart under the weight of real-world requirements like accessibility, responsiveness, or brand updates.
The problem isn't that the AI can't write CSS. The problem is that the AI doesn't understand design systems; it only understands patterns. It sees a color in one place and replicates it as an arbitrary value instead of mapping it to a token.
The Arbitrary Value Trap
One of the most frequent failures I see when agents generate Tailwind code is 'Arbitrary Value Abuse.'
