> For clean Markdown of any page, append .md to the page URL. > For a complete documentation index, see https://developers.webflow.com/designer/reference/element-properties-methods/llms.txt. > For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server. # Element properties & methods > Learn about element properties and their related methods in the Webflow Designer API Elements in Webflow have properties that determine what functionality they support. These properties are boolean flags that indicate whether an element can have certain features like children, styles, or text content. Each property unlocks a set of related methods that you can use to manipulate the element. ## Core element properties All elements have a set of core properties that determine what actions you can perform on them: | Property | Description | Examples of Elements with Property | | :----------------- | :------------------------------------------------------ | :------------------------------------------------------------------------------------------------------------------------------------------------------------- | | `children` | Whether the element can contain child elements | `DivBlock`, `Section`, `Container` | | `attributes` | Whether the element has settable HTML attributes | Most elements | | `customAttributes` | Whether the element can have custom HTML attributes | Most elements | | `styles` | Whether the element can have styles applied | Most elements | | `textContent` | Whether the element can contain direct text content | `Paragraph`, `Heading` | | `appConnections` | Whether the element can connect with external apps | `Image`, `FormForm` | | `displayName` | Whether the element has a custom Navigator display name | `DivBlock`, `Section`, `Heading`, `Image` | | `visibility` | Whether the element can be made visible or invisible | Many elements but not `Iframe`, `ComponentInstance`, structural elements such as `Body`, `Meta`, and `Title`, and code-injection elements such as `CustomCode` | | `domId` | Whether the element has a settable HTML `id` attribute | All elements except `ComponentInstance` | ## Checking element properties Before using property-based methods, you should always check if the element has the required property: ```typescript const element = await Webflow.getSelectedElement(); // Check if element can have children if (element?.children) { // Safe to use children-related methods await element.append(Webflow.elementPresets.Paragraph); } // Check if element can have styles if (element?.styles) { // Safe to use style-related methods await element.setStyles([myStyle]); } ``` ## Property-based methods Each element property unlocks specific functionality that you can use in your Designer Extension: #### [Children](/designer/reference/elements/getChildren) Methods for adding, retrieving, and managing child elements. #### [Styles](/designer/reference/elements/styles) Methods for applying and managing styles on elements. #### [Text Content](/designer/reference/elements/text-content) Methods for setting and manipulating text content. #### [Attributes](/designer/reference/elements/attributes) Methods for working with HTML attributes. #### [Custom Attributes](/designer/reference/elements/custom-attributes) Methods for working with custom HTML attributes. #### [App Connections](/designer/reference/app-intents-and-connections) Methods for connecting elements with external apps. #### [Display Name](/designer/reference/elements/display-name) Methods for reading and setting the Navigator display name of an element. ## Best practices 1. **Always check properties before using methods**: ```typescript if (element?.styles) { // Now it's safe to use style methods await element.setStyles([myStyle]); } ``` 2. **Combine property and type checks when needed**: ```typescript if (element.type === "Paragraph" && element.textContent) { await element.setTextContent("New paragraph text"); } ``` 3. **Handle missing properties gracefully**: ```typescript try { if (!element.children) { console.log("This element doesn't support child elements"); return; } await element.append(Webflow.elementPresets.Paragraph); } catch (error) { console.error("Error adding child element:", error); } ``` > Learn about element properties and their related methods in the Webflow Designer API ## Docs - [Get HTML tag](https://developers.webflow.com/designer/reference/get-tag.md): - [Set HTML tag](https://developers.webflow.com/designer/reference/set-tag.md): - [Search element settings (Beta)](https://developers.webflow.com/designer/reference/element-settings/searchSettings.md): Retrieve the configurable settings for an element, such as alt text, image source, heading tag, link target, and Collection List settings. - [Collection List settings](https://developers.webflow.com/designer/reference/element-settings/collection-list-settings.md): Read, discover, and update Collection List settings with the Designer API. - [Get settings (Beta)](https://developers.webflow.com/designer/reference/element-settings/getSettings.md): Get the raw values for all settings on an element. - [Get resolved settings (Beta)](https://developers.webflow.com/designer/reference/element-settings/getResolvedSettings.md): Get the resolved values for all settings on an element. - [Set settings (Beta)](https://developers.webflow.com/designer/reference/element-settings/setSettings.md): Set one or more settings on an element. - [Get visibility (Beta)](https://developers.webflow.com/designer/reference/element-settings/get-visibility.md): Get the visibility of an element. - [Set visibility (Beta)](https://developers.webflow.com/designer/reference/element-settings/set-visibility.md): Set the visibility of an element. - [Get DOM ID (Beta)](https://developers.webflow.com/designer/reference/element-settings/get-dom-id.md): Get the HTML ID of an element. - [Set DOM ID (Beta)](https://developers.webflow.com/designer/reference/element-settings/set-dom-id.md): Set the HTML ID of an element. - [Search bindable sources (Beta)](https://developers.webflow.com/designer/reference/element-bindings/searchBindableSources.md): Search for binding sources that are compatible with an element's settings. - [Attributes (beta)](https://developers.webflow.com/designer/reference/elements/attributes.md): Get, set, and remove attributes on elements, with support for bindings and index-based access. - [Get attributes (Beta)](https://developers.webflow.com/designer/reference/attributes/getAttributes.md): Get all attributes on an element as an array of name/value pairs. - [Get resolved attributes (Beta)](https://developers.webflow.com/designer/reference/attributes/getResolvedAttributes.md): Get all attributes on an element with bindings resolved to their current values. - [Set attributes (Beta)](https://developers.webflow.com/designer/reference/attributes/setAttributes.md): Replace all attributes on an element with a provided array of attribute names and values. - [Set attribute (Beta)](https://developers.webflow.com/designer/reference/attributes/setAttribute.md): Set a single attribute on an element by name or index. - [Get attribute value (Beta)](https://developers.webflow.com/designer/reference/attributes/getAttributeValue.md): Get the value of a single attribute on an element by name or index. - [Get resolved attribute value (Beta)](https://developers.webflow.com/designer/reference/attributes/getResolvedAttributeValue.md): Get the resolved value of a single attribute on an element, with any binding evaluated. - [Remove attribute (Beta)](https://developers.webflow.com/designer/reference/attributes/removeAttribute.md): Remove a single attribute from an element by name or index. - [Custom Attributes](https://developers.webflow.com/designer/reference/elements/custom-attributes.md): Attach additional, specialized data to elements with custom attributes. - [Get All Custom Attributes](https://developers.webflow.com/designer/reference/custom-attributes/getAllCustomAttributes.md): - [Get Custom Attribute](https://developers.webflow.com/designer/reference/custom-attributes/getCustomAttribute.md): - [Set Custom Attribute](https://developers.webflow.com/designer/reference/custom-attributes/setCustomAttribute.md): - [Remove Custom Attribute](https://developers.webflow.com/designer/reference/custom-attributes/removeCustomAttribute.md): - [Styles](https://developers.webflow.com/designer/reference/elements/styles.md): - [Get Styles](https://developers.webflow.com/designer/reference/element-styles/getStyles.md): Retrieve the current style properties of the element for analysis or changes. - [Set Styles](https://developers.webflow.com/designer/reference/element-styles/setStyles.md): Set styles on an element. - [Text Content](https://developers.webflow.com/designer/reference/elements/text-content.md): Manage an element's text content. - [Set Text Content](https://developers.webflow.com/designer/reference/set-text-content.md): Set text content for an element. - [Get Text Content](https://developers.webflow.com/designer/reference/get-text-content.md): Get text content from an element. - [Display Name](https://developers.webflow.com/designer/reference/elements/display-name.md): Read and set the Navigator display name of an element. - [Get display name (Beta)](https://developers.webflow.com/designer/reference/get-display-name.md): Get the Navigator display name of an element. - [Set display name (Beta)](https://developers.webflow.com/designer/reference/set-display-name.md): Set the Navigator display name of an element.