SirHound3d ago

Show HN: CSS Studio. Design by hand, code by agent

Hi HN! I've just released CSS Studio, a design tool that lives on your site, runs on your browser, sends updates to your existing AI agent, which edits any codebase. You can actually play around with the latest version directly on the site.

Technically, the way this works is you view your site in dev mode and start editing it. In your agent, you can run /studio which then polls (or uses Claude Channels) an MCP server. Changes are streamed as JSON via the MCP, along with some viewport and URL information, and the skill has some instructions on how best to implement them.

It contains a lot of the tools you'd expect from a visual editing tool, like text editing, styles and an animation timeline editor.

https://cssstudio.ai

CSS Studio. Design by hand. Code by agent.

A visual CSS editor in your browser. Adjust styles with sliders and pickers, and your AI agent writes the changes to source.

CSS Studio
Show threadanonymous344
wysiwyg and wordpress gui editors: set width/height of an element by pixels.
Me: no thank you, i need col-sm-12 and col-md-6 like in bootstrap... actually i use bootstrap 90% of my projects
Apr 9 at 3:48pmWeb
Show threadape43d ago
I imagine it would be harder to make a design product that doesn't use pixels but it needs to be done - because that's the right way to make CSS