Create color variable

collection.createColorVariable(name, value)

Create a color variable with a name and value for the variable.

Once created, you can set color variables for: Text colors, Background colors, Border and text stroke colors, and Gradient color stops

Syntax

1
collection.createColorVariable(name: string,value: string | ColorVariable): Promise<ColorVariable>

Parameters

• name : string - Name of the variable
• value: string - Value of the variable. Value can be a string in one of three formats:
  • Color Name
  • Color rgb hex value
  • Color rgba hex value

Returns

Promise<ColorVariable>

A Promise that resolves to a ColorVariable object.

Example

1
// Get Collection
2
const collection = await webflow.getDefaultVariableCollection()
3
4
// Create Color Variable with a HEX Codre
5
const myColorVariable = await collection?.createColorVariable("primary", "#ffcc11")
6
console.log(myColorVariable)

Designer Ability