發表文章

How to Get Pixel-Perfect UI From Claude Code (Stop Describing Buttons in Words)

圖片
AI coding tools don't have a taste problem. They have a spec problem. Ask Claude Code for “a clean, modern button” and you get a coin flip. Give it exact values (radius, padding, per-state colors, transition timing) and the output matches your design almost deterministically. In my blind test, a spec-grade prompt reproduced a button with all 11 measured CSS properties identical. I ship UI with Claude Code and Cursor daily, and for months my least favorite loop was the visual one: generate a component, squint at it, then spend twenty minutes typing follow-ups like “a bit rounder” and “the hover feels too dark.” The logic was right on the first try; the pixels never were. So I stopped describing components in adjectives and started writing specs. Here's the exact method, and the experiment that convinced me it works. Why do AI tools get UI “almost right”? Because adjectives are lossy. When you write “modern button...