> This page is for MCP Server. > For clean Markdown of any page, append .md to the page URL. > For a complete documentation index, see https://developers.webflow.com/llms.txt. > For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server. # Designer Session > Reference for Webflow MCP designer tools: interact with a live Designer session, select elements, navigate between pages, and capture visual snapshots. Designer tools operate on a live Designer session. They require the [MCP Bridge app](/mcp/reference/how-it-works#webflow-mcp-bridge-app) and an active Designer session; the Designer must be open and connected for these tools to work. This is the key difference from the data tools, which run headlessly without a session. Each tool below lists whether it reads, writes, or both. Access is governed at the tool level, so granting a tool grants all of its actions. **Note:** Every Designer tool action requires `siteId` in addition to the parameters listed below. --- ## asset\_tool write Upload an image to a site's asset library from a public URL. In 2.0 this is the only asset action that still runs through the Designer session. All other asset and folder management (listing, updating, organizing, deleting, compressing) moved to `data_assets_tool`. * Bring a remotely hosted image into a site's assets by URL during a Designer session * For any other asset or folder work, use `data_assets_tool` instead \ | Action | Description | Required parameters | | --------------------- | ----------------------------------------------- | ------------------- | | `upload_image_by_url` | Create an asset from a public remote image URL. | `url` | --- ## designer\_tool read write Interact with the live Designer session: read the current page, mode, branch, selected element, and breakpoints; select elements; navigate the canvas between pages and component views; and create page folders. * Read what's currently open or selected in the Designer * Move the canvas to a page or component, or select an element to act on; the page id it returns feeds `data_element_tool` * Read a site's breakpoints before styling, or create a page folder \ | Action | Description | Required parameters | | -------------------------------- | ----------------------------------------------------------------------------------------------------------------- | -------------------------------------------- | | `check_if_inside_component_view` | Check whether the canvas is currently inside a component view. | None | | `close_component_view` | Close a component instance view and return to page view. | None | | `create_page_folder` | Create a new page folder. | `page_folder_name` | | `get_all_breakpoints` | Get all breakpoints (media queries) for the site, in cascade order. | None | | `get_branch_parent_page_id` | Get the parent page ID of the current page (the original, for branch pages). | None | | `get_current_branch_id` | Get the branch ID of the current page, if on a branch. | None | | `get_current_component` | Get the component currently being edited on the canvas (null on a regular page). | None | | `get_current_mode` | Get the current Designer mode (design, build, preview, edit, or comment). | None | | `get_current_page` | Get the page currently active in the Designer. | None | | `get_selected_element` | Get the currently selected element, returning its id and the page id (usable as `pageId` in `data_element_tool`). | None | | `list_branches` | Discover all branches for a page by page ID. | `page_id` | | `open_canvas` | Navigate the canvas to a component or page (exactly one of the two). | `component_id` or `page_id` | | `open_component_view` | Open a component instance view for editing or reading. | `component_instance_id {component, element}` | | `select_element` | Select an element on the active page, returning its id and the page id. | `id {component, element}` | | `switch_page` | Switch the Designer to a given page. | `page_id` | --- ## element\_snapshot\_tool read Capture a visual snapshot of a Designer element for debugging and visual feedback. This lets an agent see the current state of a site and verify its own changes without publishing. * Confirm what an element actually looks like on the canvas * Verify that a change landed as intended before publishing \ | Action | Description | Required parameters | | ---------------------- | ---------------------------------------------------------------- | ------------------------- | | `get_element_snapshot` | Get a visual snapshot of a Designer element by its composite id. | `id {component, element}` |