StylesCreating & Retrieving Styles

Create style

webflow.createStyle(name, options?)

Create a new style with a provided name. Provide a parent style to create a combo class.

Syntax

webflow.createStyle(
  name: string,
  options?: {
    parent?: Style
  }
): Promise<Style>

Parameters

  • name: String - The name of the style.
  • options: Object - An object containing the following properties:
    • parent: Style - A style object that will be the parent of the combo class style.

Returns

Promise<Style>

A Promise that resolves to a Style object.

Example

// Create new style
const newStyle = await webflow.createStyle(styleName);
// Set properties for the style
newStyle.setProperties({
  "background-color": "blue",
  "font-size": "16px",
  "font-weight": "bold",
});
// Get Selected Element
const selectedElement = await webflow.getSelectedElement()
if (selectedElement?.styles) {
  // Apply style to selected element
  await selectedElement.setStyles([newStyle])
} else {
  console.log("No element selected")
}

Designer ability

Designer abilityLocaleBranchWorkflowSitemode
canCreateStyleBlocksPrimaryAnyCanvasDesign