Skip to content
Scalekit Docs

Webflow MCP

Vendor MCP40 toolsOAuth 2.1/DCRDesignDeveloper ToolsProductivity

Connect to Webflow. Build and manage websites, pages, components, styles, assets, CMS collections, and site settings through the Webflow Designer and Data...

Webflow MCP connector

  1. Terminal window
    npm install @scalekit-sdk/node

    Full SDK reference: Node.js | Python

  2. Add your Scalekit credentials to your .env file. Find values in app.scalekit.com > Developers > API Credentials.

    .env
    SCALEKIT_ENVIRONMENT_URL=<your-environment-url>
    SCALEKIT_CLIENT_ID=<your-client-id>
    SCALEKIT_CLIENT_SECRET=<your-client-secret>
  3. quickstart.ts
    import { ScalekitClient } from '@scalekit-sdk/node'
    import 'dotenv/config'
    const scalekit = new ScalekitClient(
    process.env.SCALEKIT_ENV_URL,
    process.env.SCALEKIT_CLIENT_ID,
    process.env.SCALEKIT_CLIENT_SECRET,
    )
    const actions = scalekit.actions
    const connector = 'webflowmcp'
    const identifier = 'user_123'
    // Generate an authorization link for the user
    const { link } = await actions.getAuthorizationLink({ connectionName: connector, identifier })
    console.log('Authorize Webflow MCP:', link)
    process.stdout.write('Press Enter after authorizing...')
    await new Promise(r => process.stdin.once('data', r))
    // Make your first call
    const result = await actions.executeTool({
    connector,
    identifier,
    toolName: 'webflowmcp_get_asset_preview',
    toolInput: { asset_id: 'YOUR_ASSET_ID', context: 'YOUR_CONTEXT' },
    })
    console.log(result)

Connect this agent connector to let your agent:

  • Get asset preview, more tools, image preview — Get an image preview of a site asset by its asset ID
  • Tool designer, data variable, data style — Interact with the user’s live Webflow Designer session — select an element on the canvas or read which element is currently selected, navigate the canvas between pages and component canvases, switch to or read the current page, list a page’s branches, read the current branch ID, parent page ID, and Designer mode, enter, exit, or inspect the current component view, and read all breakpoints (media queries) configured for the site
  • Builder data whtml, data element, data component — Data Tool - WHTML builder to insert elements from HTML and CSS strings on a page via the public-mcp headless surface
  • Ai ask webflow — Ask Webflow AI any question about the Webflow API and get a direct answer

Use the exact tool names from the Tool list below when you call execute_tool. If you’re not sure which name to use, list the tools available for the current user first.

webflowmcp_ask_webflow_ai#Ask Webflow AI any question about the Webflow API and get a direct answer.2 params

Ask Webflow AI any question about the Webflow API and get a direct answer.

NameTypeRequiredDescription
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
messagestringrequiredYour question about the Webflow API.
webflowmcp_asset_tool#Designer Tool - Upload an image from a publicly accessible URL as a Webflow asset. Other asset and folder management is handled by data_assets_tool.3 params

Designer Tool - Upload an image from a publicly accessible URL as a Webflow asset. Other asset and folder management is handled by data_assets_tool.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_component_builder#Insert component instances onto the current active page into an element or a component instance slot.3 params

Insert component instances onto the current active page into an element or a component instance slot.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_data_agent_instructions_tool#Data tool - Manage agent instructions (rules and skills) for a site. Actions: search_instructions, read_instruction, create_instruction, update_instruction, delete_instruction, move_instruction. Paths must follow 'rules/<name>.md', 'rules/<name>.mdc', or '<skill-name>/SKILL.md'.2 params

Data tool - Manage agent instructions (rules and skills) for a site. Actions: search_instructions, read_instruction, create_instruction, update_instruction, delete_instruction, move_instruction. Paths must follow 'rules/<name>.md', 'rules/<name>.mdc', or '<skill-name>/SKILL.md'.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_analyze_tool#Read Webflow Analyze report data for a site, including traffic timeseries, ranked pages, ranked dimensions, ranked engagement events, and aggregate or bucketed time on page. Includes guide actions for building Analyze queries and resolving engagement event rows to page elements, component instances, and CMS context.2 params

Read Webflow Analyze report data for a site, including traffic timeseries, ranked pages, ranked dimensions, ranked engagement events, and aggregate or bucketed time on page. Includes guide actions for building Analyze queries and resolving engagement event rows to page elements, component instances, and CMS context.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_assets_tool#Data tool - Manage Webflow site assets and asset folders via the Data API. Creates asset metadata entries and returns presigned S3 upload information (uploadUrl and uploadDetails) used to upload the file bytes, and supports listing, updating, organizing, and deleting assets and asset folders, plus compressing image assets to webp or avif via async tasks.2 params

Data tool - Manage Webflow site assets and asset folders via the Data API. Creates asset metadata entries and returns presigned S3 upload information (uploadUrl and uploadDetails) used to upload the file bytes, and supports listing, updating, organizing, and deleting assets and asset folders, plus compressing image assets to webp or avif via async tasks.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_cms_tool#Data tool - CMS tool to manage collections, collection fields (static/option/reference), collection field groups, and collection items (list, create, update, publish, unpublish, delete)2 params

Data tool - CMS tool to manage collections, collection fields (static/option/reference), collection field groups, and collection items (list, create, update, publish, unpublish, delete)

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_comments_tool#Manage Webflow Designer comments — list threads by page, filter by resolution status or date, search comment authors, and reply to existing threads.2 params

Manage Webflow Designer comments — list threads by page, filter by resolution status or date, search comment authors, and reply to existing threads.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
webflowmcp_data_component_builder#Data Tool - Component builder to insert component instances on a page via the public-mcp headless surface. Supports inserting into an element (insert_in_element) or into a component instance's slot (insert_in_slot), with recursive nested-component trees via component_schema.slots.4 params

Data Tool - Component builder to insert component instances on a page via the public-mcp headless surface. Supports inserting into an element (insert_in_element) or into a component instance's slot (insert_in_slot), with recursive nested-component trees via component_schema.slots.

NameTypeRequiredDescription
actionsarrayrequiredComponent insertion actions executed sequentially.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id that exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_component_props_tool#Data tool - Component props tool to manage prop definitions and set or reset prop values on component instances.4 params

Data tool - Component props tool to manage prop definitions and set or reset prop values on component instances.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_component_tool#Data tool - Component tool to manage component definitions and instances: create, query, transform, insert, unlink.4 params

Data tool - Component tool to manage component definitions and instances: create, query, transform, insert, unlink.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_component_variants_tool#Data tool - Component variants tool to manage variants and per-variant style overrides.4 params

Data tool - Component variants tool to manage variants and per-variant style overrides.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_element_builder#Data Tool - Element builder to create elements on a page via the public-mcp headless surface.4 params

Data Tool - Element builder to create elements on a page via the public-mcp headless surface.

NameTypeRequiredDescription
actionsarrayrequiredElement creation actions executed sequentially. Each item creates one element at the requested position.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id that exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_element_settings_tool#Read and write element settings and data bindings on a Webflow page: get or set settings, discover bindable sources, and set tag, visibility, and DOM id via static values or prop bindings.4 params

Read and write element settings and data bindings on a Webflow page: get or set settings, discover bindable sources, and set tag, visibility, and DOM id via static values or prop bindings.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredWebflow page ID. Use list_pages to discover page IDs.
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_element_tool#Inspect and modify elements on a Webflow page: query the element tree, move or remove elements, and edit text, styles, links, images, heading levels, attributes, and display names.4 params

Inspect and modify elements on a Webflow page: query the element tree, move or remove elements, and edit text, styles, links, images, heading levels, attributes, and display names.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredWebflow page ID. Use list_pages to discover page IDs.
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_enterprise_tool#Manage enterprise-tier Webflow settings including 301 redirects and robots.txt. Requires an Enterprise workspace plan.2 params

Manage enterprise-tier Webflow settings including 301 redirects and robots.txt. Requires an Enterprise workspace plan.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
webflowmcp_data_fonts_tool#Data tool - Manage a site's uploaded custom fonts: list and inspect them, register new fonts and replace their files (a two-step upload flow), update font metadata, and remove fonts individually or in batches.2 params

Data tool - Manage a site's uploaded custom fonts: list and inspect them, register new fonts and replace their files (a two-step upload flow), update font metadata, and remove fonts individually or in batches.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_forms_tool#Data tool - Read forms and manage form submissions on a site. Actions: list_forms, get_form, list_site_form_submissions, list_form_submissions, get_form_submission, update_form_submission, delete_form_submission.2 params

Data tool - Read forms and manage form submissions on a site. Actions: list_forms, get_form, list_site_form_submissions, list_form_submissions, get_form_submission, update_form_submission, delete_form_submission.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_localization_tool#Localize Webflow pages and components into secondary locales by reading and updating static content.2 params

Localize Webflow pages and components into secondary locales by reading and updating static content.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_pages_tool#Data tool - Pages tool to perform actions like list pages, get page metadata, update page settings, create a page, bulk update page settings, manage branches and their staging previews (branch actions require the site's workspace to be on an Enterprise plan), and read or write JSON-LD schema markup for pages in bulk.2 params

Data tool - Pages tool to perform actions like list pages, get page metadata, update page settings, create a page, bulk update page settings, manage branches and their staging previews (branch actions require the site's workspace to be on an Enterprise plan), and read or write JSON-LD schema markup for pages in bulk.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_scripts_tool#Data tool - Scripts tool to manage custom code scripts. Register, apply, update, and remove scripts at the site or page level, and read or write freeform head/footer custom code blocks.2 params

Data tool - Scripts tool to manage custom code scripts. Register, apply, update, and remove scripts at the site or page level, and read or write freeform head/footer custom code blocks.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_sitemap_tool#Data tool - Manage sitemap indexing status for CMS collection items and static pages. Read and update whether pages and collection items appear in a site's generated sitemap. All endpoints are under the /beta namespace. Folder pages, collection template pages, and utility pages are not supported for page endpoints.2 params

Data tool - Manage sitemap indexing status for CMS collection items and static pages. Read and update whether pages and collection items appear in a site's generated sitemap. All endpoints are under the /beta namespace. Folder pages, collection template pages, and utility pages are not supported for page endpoints.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_data_sites_tool#Data tool - Sites tool to perform actions like list sites, get site details, and publish sites2 params

Data tool - Sites tool to perform actions like list sites, get site details, and publish sites

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
webflowmcp_data_style_tool#Data Tool - Style tool to perform actions like get all styles, create a new style, update a style, query styles, remove a style, and manage style variable modes4 params

Data Tool - Style tool to perform actions like get all styles, create a new style, update a style, query styles, remove a style, and manage style variable modes

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_variable_tool#Data Tool - Variable tool to perform actions like create variable, get all variables, query variables, update variable, rename and delete variables, and reorder variable collections.4 params

Data Tool - Variable tool to perform actions like create variable, get all variables, query variables, update variable, rename and delete variables, and reorder variable collections.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_data_webhook_tool#Data tool - Webhook tool to perform actions like list webhooks, create webhooks, get webhook details, and delete webhooks for a Webflow site.2 params

Data tool - Webhook tool to perform actions like list webhooks, create webhooks, get webhook details, and delete webhooks for a Webflow site.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
webflowmcp_data_whtml_builder#Data Tool - WHTML builder to insert elements from HTML and CSS strings on a page via the public-mcp headless surface. Accepts HTML markup and optional raw CSS rules, constructs WHTML, and inserts it into a parent element.4 params

Data Tool - WHTML builder to insert elements from HTML and CSS strings on a page via the public-mcp headless surface. Accepts HTML markup and optional raw CSS rules, constructs WHTML, and inserts it into a parent element.

NameTypeRequiredDescription
actionsarrayrequiredWHTML insertion actions executed sequentially. Each item inserts one HTML/CSS fragment at the requested position.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
pageIdstringrequiredAny valid page id that exists in the site
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_de_component_tool#Designer tool - Component tool to perform actions like create component instances, get all components and more.3 params

Designer tool - Component tool to perform actions like create component instances, get all components and more.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_de_page_tool#Manage Designer pages — create pages and folders, switch pages, open components, and inspect branch and mode state.3 params

Manage Designer pages — create pages and folders, switch pages, open components, and inspect branch and mode state.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_designer_tool#Interact with the user's live Webflow Designer session — select an element on the canvas or read which element is currently selected, navigate the canvas between pages and component canvases, switch to or read the current page, list a page's branches, read the current branch ID, parent page ID, and Designer mode, enter, exit, or inspect the current component view, and read all breakpoints (media queries) configured for the site.3 params

Interact with the user's live Webflow Designer session — select an element on the canvas or read which element is currently selected, navigate the canvas between pages and component canvases, switch to or read the current page, list a page's branches, read the current branch ID, parent page ID, and Designer mode, enter, exit, or inspect the current component view, and read all breakpoints (media queries) configured for the site.

NameTypeRequiredDescription
actionsarrayrequiredExecuted sequentially. Each item must include label and exactly one action property.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
siteIdstringrequiredWebflow site ID. Discover with list_sites.
webflowmcp_element_builder#Designer Tool - Element builder to create element on current active page.3 params

Designer Tool - Element builder to create element on current active page.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_element_snapshot_tool#Capture a visual snapshot of a Designer element for debugging and visual feedback.3 params

Capture a visual snapshot of a Designer element for debugging and visual feedback.

NameTypeRequiredDescription
actionobjectrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_element_tool#Designer Tool - Element tool to perform actions like get all elements, get selected element, select element on current active page. and more3 params

Designer Tool - Element tool to perform actions like get all elements, get selected element, select element on current active page. and more

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_get_asset_preview#Get an image preview of a site asset by its asset ID. Fetches the asset's metadata, downloads the smallest available image variant (or the original file when no variants exist), and returns the image content. Works with any image content type (e.g. JPG, PNG, GIF, WEBP); non-image files and files larger than 2 MB return an error instead of an image. Returns a 404 error if the asset does not exist or has been deleted.2 params

Get an image preview of a site asset by its asset ID. Fetches the asset's metadata, downloads the smallest available image variant (or the original file when no variants exist), and returns the image content. Works with any image content type (e.g. JPG, PNG, GIF, WEBP); non-image files and files larger than 2 MB return an error instead of an image. Returns a 404 error if the asset does not exist or has been deleted.

NameTypeRequiredDescription
asset_idstringrequiredThe asset ID to preview. Discover asset IDs via data_assets_tool > list_assets.
contextstringrequiredDescription of what the user is trying to accomplish, used to select the right action.
webflowmcp_get_image_preview#Designer Tool - Get image preview from url. this is helpful to get image preview from url. Only supports JPG, PNG, GIF, WEBP, WEBP and AVIF formats.3 params

Designer Tool - Get image preview from url. this is helpful to get image preview from url. Only supports JPG, PNG, GIF, WEBP, WEBP and AVIF formats.

NameTypeRequiredDescription
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
urlstringrequiredThe URL of the image to get the preview from
webflowmcp_get_more_tools#Check for additional tools whenever your task might benefit from specialized capabilities - even if existing tools could work as a fallback.3 params

Check for additional tools whenever your task might benefit from specialized capabilities - even if existing tools could work as a fallback.

NameTypeRequiredDescription
briefstringrequiredDescribe the use case, what the user wants to accomplish, why existing tools are insufficient, and any relevant Webflow context.
categorystringrequiredThe category of the capability you are looking for.
contextstringrequiredA short description of your goal and what kind of tool would help accomplish it.
webflowmcp_style_tool#Designer Tool - Style tool to perform actions like create style, get all styles, update styles, remove styles3 params

Designer Tool - Style tool to perform actions like create style, get all styles, update styles, remove styles

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_variable_tool#Manage Webflow Designer variables — create, list, update, rename, delete, and manage style variable modes.3 params

Manage Webflow Designer variables — create, list, update, rename, delete, and manage style variable modes.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.
webflowmcp_webflow_guide_tool#Retrieve Webflow tool usage guidelines and recommended workflows before performing any actions.1 param

Retrieve Webflow tool usage guidelines and recommended workflows before performing any actions.

NameTypeRequiredDescription
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
webflowmcp_whtml_builder#Insert elements on the current active page from HTML and CSS strings, accepting markup and optional CSS rules.3 params

Insert elements on the current active page from HTML and CSS strings, accepting markup and optional CSS rules.

NameTypeRequiredDescription
actionsarrayrequiredNo description.
contextstringrequiredBrief description of why this tool is being called in context of the user goal (15-25 words, third-person).
siteIdstringrequiredThe unique ID of the Webflow site. Get it from the data_sites_tool if not known.