StylesCreating & Retrieving Styles

Get style by name or path

webflow.getStyleByName(nameOrPath)

Retrieve a Style by its name or path.

Syntax

webflow.getStyleByName(nameOrPath: string | Array<string>): Promise<Style | null>

Parameters

  • nameOrPath: string | Array<string> - The name of the style to retrieve or the path to the style to retrieve, consisting of the name of the parent and the name of the style.

Returns

Promise<Style | null>

A Promise that resolves to a style object, or null if the named style doesn’t exist.

Examples

Getting a style by name:

// Retrieve the style by name
const retrievedStyle = await webflow.getStyleByName(styleName);
if (retrievedStyle) {
  // Get and print properties of the retrieved style
  const styleProperties = await retrievedStyle.getProperties();
  console.log("Style properties:", styleProperties);
} else {
  console.log(`Style ${styleName} not found.`);
}

Getting a style by path:

// Retrieve the style by parent name and style name
const retrievedStyle = await webflow.getStyleByName([styleParentName, styleName]);
if (retrievedStyle) {
  // Get and print properties of the retrieved style
  const styleProperties = await retrievedStyle.getProperties();
  console.log("Style properties:", styleProperties);
} else {
  console.log(`Style ${styleName} with parent ${styleParentName} not found.`);
}

Designer Ability

Checks for authorization only

Designer AbilityLocaleBranchWorkflowSitemode
canAccessCanvasAnyAnyAnyAny