Most of the devs that have something to do with web design and frontend changes might have encountered this problem when vibe coding or trying to change some design or CSS via LLMs. What typically happens is either the LLM would change not only what was requested but bunch of other unneeded elements or it would change multiple elements, when the request was for a single one. I am sure that there can be given countless other examples like this.

The problem I believe lies in the lack of context and vision that the LLM has across sessions and prompts - at best it would open a browser and try to work through the prompt and solve whatever is needed.

What I did was building an MCP that harnesses the LLM to pinpoint the exact issue by giving context about what actually renders on the page and giving a clearer picture of how styles and scripts of the app or site render. In my opinion this solves the issue to an extent that doing design changes are now more reliable and stable. Changes done with my MCP are delivered in a more consistent manner across chat sessions and prompts.

I did some tests and actually am pretty happy with the end result and now need to popularize this MCP so that I can improve it and get more feedback, because my dev stack is only CSS and JS.

I would appreciate it if someone that experiences similar issues try my mcp and share their feedback or even just join the discussion and share their insights, solutions or show how this is adressed via other tools out there.

I called the MCp Visionaire MCP and it is available on github. It works with any MCP client (Claude Code, Copilot, Cursor), it's free and open source. Thanks!