Editor mode vs Designer mode
The difference between Webflow's Editor and Designer modes — which one to use for everyday content updates, and which to avoid.
Webflow has two ways to work on your site: the Editor and the Designer. They look very different and are meant for very different people. This guide explains which is which — and which one you should use.
Quick summary
Use the Editor for everyday content changes — it's safe, simple, and designed for non-technical users. The Designer is a professional development tool used by Chykalophia to build and maintain your site's design. Unless you've been specifically trained, avoid the Designer.
The Editor: your everyday tool
The Editor is a content editing overlay that sits on top of your live site. When you open it, your site looks almost exactly as it does to visitors — except you can click on text, images, and CMS items to edit them.
What the Editor lets you do:
- Edit text directly on the page
- Replace images
- Update links and buttons
- Add, edit, and delete CMS items (blog posts, team members, etc.)
- View form submission notifications
- Publish your changes
The Editor has guardrails. It only shows you the things you're allowed to change. You can't accidentally move a section, change a color, or break the mobile layout.
The Designer: the professional tool
The Designer is a full visual development environment. It's where Chykalophia built your site — setting up layouts, styling elements, connecting data, and adding custom code.
What the Designer is used for:
- Building and changing page layouts
- Setting fonts, colors, spacing, and visual styles
- Creating animations and interactions
- Configuring the CMS structure
- Adding new pages or sections
The Designer has no guardrails. A single mistake can affect every page on the site.
How to tell which mode you're in
- You see a floating toolbar at the bottom or top of the screen with options like 'Edit" and "Publish"
- Clicking on text shows a simple text editing cursor
- The interface looks just like your website
- There is no complex panel along the left and right sides
- You see panels along the left and right sides of a canvas
- The top bar shows device toggles (desktop, tablet, mobile icons)
- There are style settings, class names, and layout controls visible
- The interface looks nothing like your website to a visitor
How to open the Editor
Log in to Webflow. Go to webflow.com and sign in to your account.
Find your project in the Dashboard. You'll see your site listed as a project card.
Click 'Open Editor" or hover over the card. Some dashboards show an "Editor" link directly on the card. You can also click the project, then look for the Editor option.
Alternatively, go to your live site. Add ?edit to the end of your site's URL (e.g. yoursite.com?edit) and log in when prompted.
What to do if you accidentally open the Designer
Close the browser tab. Webflow doesn't automatically save or publish anything in the Designer — you'd have to actively click Save and then Publish for any change to go live. Simply closing the tab is safe.
Don't publish from the Designer unless instructed
If you make accidental changes in the Designer and then click Publish, those changes will go live. Always close the Designer without publishing if you opened it by mistake.
Side-by-side comparison
| Editor | Designer | |
|---|---|---|
| Who uses it | Clients, content managers | Developers, designers |
| What you can change | Text, images, CMS content | Everything |
| Risk of breaking the site | Very low | High if you're not trained |
| Required skill level | No technical skill needed | Web development knowledge |
| How to access | webflow.com Dashboard or ?edit | webflow.com Dashboard |
Common questions
Related guides
- Editing content safely in the Editor
- How to edit text
- The Webflow Designer, explained
- User roles & permissions in Webflow
Need a hand?