I’m opening this thread because we need to talk about a missing piece of the Cursor puzzle. We want the Design Sidebar back.
Currently, there is a massive gap between what we had and what we have now:
Old Cursor (Design Sidebar): A true visual-first workflow. You could modify your site directly with real-time property-editing controls.
Current Cursor (Design Mode): It’s now just a selection tool. You can select elements to talk about them with the agent, but you can’t tweak them yourself visually.
Why the Agent isn’t enough (The “Look Before You Leap” factor):
The best part of the old sidebar was the ability to experiment. You could tweak margins, colors, or fonts to see if they actually looked good before committing them to your codebase.
With the new Agent-only mode:
You have to prompt for every tiny change.
The Agent immediately changes your files.
If it looks bad, you have to undo or prompt again.
The old sidebar gave us instant visual feedback without the overhead of generating new code for every small test. It was faster, more intuitive, and gave us total control.
The Request:
Don’t just give us a selection tool for the Agent. Bring back the direct property-editing controls. Let us design, experiment, and code simultaneously again.
Who else is missing the visual controls? Let’s get this back on the roadmap!
The inspector was my favorite way to tweak properties.
I really like Design Mode for big sweeping changes, but sometimes I just want to tweak one or two small things in inspector, and I know its an inefficient usage of tokens to use Design mode, AND its faster for me to find the layer and make the change rather than to type a prompt out and let the agent do the same work.
Design Mode + Inspector would be S tier @mohitjain
Hey, thanks for the detailed feedback, both you and @T8or. The difference you’re describing makes sense: the current Design Mode is geared toward selection for the agent, and you’re missing direct property editing controls so you can quickly try margin, color, or font locally before it turns into code.
I’ll pass the request to bring back those visual controls to the team. It’s not a one-off, the same theme has come up in a couple of related threads:
I’ve noted the idea of Design Mode plus an Inspector. I can’t share a timeline or make roadmap promises, but if there’s an update in this direction, I’ll reply in the thread.
Chiming in, as the loss of the design panel as well as the object selection tool have completely killed an incredibly effective workflow.
This feels like a huge regression for designers, please please bring these features back.
Design mode was a great way to make small style changes, but it was also a great way to inspect elements for human-readable style properties. Yes, that information is in dev tools; but it requires tracing the style sheet cascade up the chain to discern all the properties that apply.
Also, the workflow has now become:
inspect the design with dev tools
switch to the agents window to make a styling change
switch back to dev tools to inspect the result
Previously, it was possible to do both changing and inspecting in the same place.
Yes Cursor Team please bring this back! As a frontend designer, we like to play with ideas (what colors, sizes, styles feel best?). Now I have to speak to each individual change, costing unnecessary tokens, and I am not able to batch edit. For now, the solution is to use dev tools, but I actually liked the simple visual editor that Cursor provided, as it placed all my changes into a single batch prompt.
Two points on top of the original request are especially helpful: being able to inspect human-readable properties right in the panel without tracing the cascade in DevTools, and being able to batch edit without a separate prompt for every small change. I shared both use cases with the team, along with the idea of a Design Mode plus Inspector.
This topic clearly isn’t limited to one thread. Similar requests are also being collected here:
I was shocked to see this feature removed from the Cursor interface. I hope the developers understand how important it is to maintain our workflows and utilize the tools we have, as they significantly impact our productivity and well-being. This tool was pivotal for targeting elements in the browser and obtaining specific results. Its removal has eliminated a key feature, which I consider a poor decision and a serious oversight by the development team.
I agree with others who feel this feature needs to be reinstated. If the development IDE moves away from tools that serve real-world developers effectively, we risk losing developers who seek alternatives that respect their established workflows and skill sets. Many of us do not want AI to take over our processes; instead, we want to guide and oversee our work to achieve the best results.
An additional disadvantage is that it’s no longer possible to select elements which are higher up the stack. The Design Mode selection tool only chooses the most front-ward element in the DOM. Clicking and dragging to draw a line around an area is clunky and imprecise (will Cursor understand which element I’m encompassing, or think I mean something else in the stack which is visible in this space?).
