April 9, 2026
Design by hand, drama by thread
Show HN: CSS Studio. Design by hand, code by agent
AI writes the code: Figma face‑off, landing‑page roast, and price‑math memes
TLDR: CSS Studio promises “edit on the page, AI updates your code” for $99, and the crowd is intrigued but demanding receipts. Commenters clashed over Figma comparisons, roasted the landing page, joked about odd euro pricing, and begged for a 30‑second demo to prove it works.
CSS Studio — a new tool from the Motion team that lets you edit a site in the browser while an AI agent writes the code — just hit Hacker News, and the comments lit up. The pitch: tweak colors, layouts, text, even animations on‑page, then hit sync and the agent updates your project. One‑time price: $99.
But the crowd came for the drama. First volley: comparison wars. One user stepped in as the “boogeyman” to ask how this stacks up against Figma’s AI (Figma is a popular design app), snarking that Figma’s tool is “just a GPT wrapper” — as in, powered by ChatGPT — but still easy. Another demanded a 30‑second video demo front and center: “No one is clicking until they know what this is.” Translation: show, don’t tell.
Then came the roast. A top critique slammed the site’s vibe as “tacky” and too AI‑generated‑looking for a design product, urging the team to redo the landing by hand to prove the tool has soul. Meanwhile, pricing turned into a meme when someone side‑eyed euro amounts like 64.23€ and 256.92€, calling the math suspicious. And the devs asked the real question: does this work with frameworks like Chakra (tools that mix styles into code), and can the agent find the right files?
Verdict: big curiosity, bigger expectations. The community wants proof, polish, and receipts — preferably in a punchy video.
Key Points
- •CSS Studio is an early-access visual CSS editor that syncs browser-based design changes to source code via a local AI agent.
- •The workflow includes designing on-page, syncing edits to an agent that finds and updates files, and reviewing diffs before commit and deploy.
- •It claims compatibility with all browsers and to work with any framework or plain CSS, and supports “all major agents.”
- •Features include on-page layout/style editing, a CSS @keyframes timeline, CSS variable detection/editing, and DOM editing tools.
- •Additional tools cover spring easings (powered by Motion), gradient editing, and a color picker; pricing is a one-time $99 including future updates.