The Future of Web Design: Cursor’s Visual Editor vs Webflow

cursor launch a revolutionary new visual editor. It's probably the end of Web Flow to be honest. So, this is what I'm building, right? I'm building like an animation tool to to do this b this type of stuff and then add it to your project. In the past, uh if I wanted to change the the design, the HTML and the CSS essentially, I would have to, you know, come here and just change it manually or ask AI to do it. Now I can click this button and then I can click whatever element here I have this div. When once I click it this like design looking tool uh pops up and I can literally just play with the flexbox. This is like super cool. I can do a grid. This looks very much like what web flow has. The padding, the margin are here. the appearance, text, color, like pretty much everything is here. You can add tokens. And what I really like about this whole setup is this design versus CSS. By the way, that you can also see the CSS stuff and just change them here because sometimes this UI becomes too cumbersome. Let's say I want to add a a CSS caulk like in web flow you do it in the UI and it's like you need multiple clicks to do a caulk um and then you get out of it and you know going back and forth and changing the numbers becomes like a hassle here you you can do it like in this this new layout. So um that is also nice and obviously you have your uh elements here the they call it components. Now what is really interesting about this something that I didn't know and you pointed out I thought that when when you do these changes it's done but it's not exactly. So the way this works, this is essentially Chrome uh developer tools visualized because like if you go to your Google Chrome and check check your code, you you essentially have all of these but in different view now you have this in this visual way but that is just changing what we are seeing here and not the actual code. It's not changing the actual code. Once we are done with playing around with it, you you click apply and then it adds those changes as a prompt as you see display from block to flex, row to column blah blah blah for that element and then it goes on and does it. So it's still prompt based which is really funny. It it is something about this to me is extremely funny that you are doing like flex alignment visually and then applying it with a pro like we are burning tokens. We are burning down trees. I know this is a joke. We we but we're burning through tokens for something that we have already done visually. But I I I didn't know why. But you you you can explain it better. You mentioned that you said like if you're using Tailwind, you don't want to change stuff in line and just randomly add CSS. It has to know to go to the source. Like if I'm changing this, I'm not just changing this class or you know this element. This is maybe a design token coming from somewhere else. So that's why it goes to the AI and the AI knows ah okay that that's that's the context that's how it should be done. There you go. You explain it beautifully. You explain it beautifully. Yeah cuz like you know again it might be that um you're using another language you're use you know you're you're using a certain class naming system or something like that has it has that as you say context. So it makes sense. Um you don't want inline styles everywhere. Uh but it would be nice yeah if they can figure out a way that you're well again you don't want to run AI with every single change that you make because you might be experimenting you might be exploring right you might be like h do I want it left do I want it center do I want it right all this kind of stuff you don't want to run an AI command over that but I guess the only downside here is that it is using AI which means it's open to hallucinations so like [snorts] maybe they've got a system maybe they've trained their model or whatever um I'm guessing it just uses cursor or can You just select can you you can select the model that it runs on. Uh you can select the model I was using composer sorry not 5 wait [laughter] what this is kind of funny because I was using max mode. Oh god. GPT 5.1 codeex max to change the alignment of a place. [laughter] Those poor poor trees. Yeah it reasoned for burning. See that? That should not If you switch that to composer now, if you just undo that or or make some more changes, go to composer. Composer will just do it like that. GBT chat GBT. It's so so long. But yeah, it's pretty it's pretty cool. Um, you know, it raises the question, who who is this for? Is this going to I mean, they mention on the Twitter thread, this is going to bring designers and developers closer together. I actually think it will tear them apart because a developer who really just, you know, many of them don't know or care about the design. They're they're kind of encouraged now to make a little uh tweak here or there. I hope that on the enterprise plan you can turn this mode off or or switch this mode off. But um yeah. Yeah, it's it's an interesting feature. It's something we want. But it it just goes to show again how perfect the UI is for Web Flow, how they've kind of nailed that, you know. Um, no one's really brought out anything groundbreaking. Yeah, true. like web flow really nailed down and even though some folks still saying like uh framework looks a bit uh neater maybe it's like the contrast and the color and it's a bit simpler but still like web flow there is nothing that has come that is better uh than web flow like fundamentally better uh but again like this this I really liked it I really like having the idea of like maybe for you know if I'm doing caulk something like this would be nice with web flow or like clamp you know the the especially with caulk it can get really um long the syntax you have so yeah the only thing the only thing it doesn't have is obviously you can't drag and drop elements into this right you can't drag a form element you can't drag an input you can't drag a button so you have to first prompt the the UI get the UI or the at least the framework in which you can then edit. This is an editor, not like a creation tool, right? So that's the only other thing to to consider here. So again, just I wonder who this who is who who do you think this is for? Does this does this fit into your workflow? Does this fit into a imaginary workflow that you don't quite use, but you can see that like these buttons and the the HTML for these are generated with AI. So I'm asking AI, hey add that button and that paragraph and then it decided to give it let's say this border color. I actually didn't. This is like AI taste. Why should that paragraph look like a box whatever it does? So for something like this I could see it useful. So instead of asking uh AI to ah go change the style blah blah I'll just come here and let's say I I don't like the background I can just remove it you know or I don't like the border I just remove it done in instead of like fiddling with the prompt and like asking just it took me two clicks. Yeah. Yeah. Yeah. So in in some areas this could make sense. It doesn't replace like a creation design tool, but it's it's definitely a lot of web flow people were thinking about um you know bouncing and going they're all questioning whether cursor is the is the tool for them and for a lot lot of those people it's not because they still want to they still want to create they still want to design but this will certainly make the transition a lot better that they can actually handle the thing that they've created because they you know again they don't want to write code or they don't know what to prompt you It's it's a nice little nice very very welcome addition. I just worry that cursor is getting very very bloated. Yeah, like man the UI I the the model uh let me see if I can uh show it like you know when I want to choose the model uh sometimes let's see if I do this sometimes this you see this window that pops up next here this little window it pops up here like on the left like it happens a lot of the times like all the times it happens and it happens with one of the models and not the other one like [snorts] this is the tiniest thing like I want to read what it is and then I have to read on the other side like the UI is broken. So yeah and even this editor and versus the agent view um or like the way you prompt it changes all the time. It makes me question like it why is it like this in this project why is it like that in another project? So, it is very bloated and I feel [clears throat] like a lot of this is because of it being very bloated. You know, they're just they're just adding and adding and adding features and it probably just needs a bit of a reset and like what what are people using? What can we get rid of? Um, yeah. And I think this is normal for an industry that is not figuring that hasn't figured out yet. Exactly. Uh I I feel like this is like I don't know like 200 what 15 or so no prior to web flow like when WordPress was still figuring out templates like it was so messy. It is still so messy but after web flow figured out UI for code especially like UI for front code is what web flow actually like solidified and figured it out. Every single tool after is just a copy of web flow. It's just like naturally a a very sim like even this this is like a bad copy of web flow, right? Yeah. Yeah. And even they might not I don't know if they copied literally web flow or not but like the whole industry like decided to go this direction because it's a logical conclusion, right? It's a logical conclusion to land on. Exactly. That's what I'm saying. So, we still haven't figured out uh the the proper UI for AI in my opinion. Like yes, there are like talks about like AI doesn't need UI. I still disagree. Like uh I still feel like we want to have control because we're such visual creatures. we want to to have that level of um that or like that form of information. It might not be ideal, but it's it's the one that makes the most sense. And I don't doubt that others have been explored. And in some ways, this is, you know, it's you you don't need to know that this is writing a prompt. But because you had that chat window open, like what would happen if actually I know what happens because that's how I learned when you have that chat window closed, it opens up. But all you need to do is abstract that away and then you've got your your AI. Be nice if they actually let's speculate be nice if they make this like open open s well they it is open source because it's cursor but like a way to add certain controls that you often use. Maybe it's drop shadow or maybe it's um I don't know maybe it's adding um tailwind and drop down to the things or whatever. Although this is cursor, we we did a we did a showcase on uh pencil uh a few weeks ago which started out this this idea of like it won't take Figma long to either build a plug-in for cursor or VS Code or it won't take cursor long to build this feature in. So, but pencil could be the the thing on VS Code, you know, it's a lot it could be your answer if you're into this sort of stuff. Yeah. Uh yeah, but at the end of the day, all of this is uh still in development, hasn't been figured out. So web flow is adding AI and cursor being an AI tool is adding visual editor. That's that's basically two different directions moving towards the same thing. They are trying to own the whole vertical of creating for the web with AI and with visual input all in one place. This is part of a larger conversation on my show, Command AI, which we stream live every single week. We discuss the news and all things related to AI in the world of design and web. Catch us next week and join in the banter.