> This page is for Home.

> For clean Markdown of any page, append .md to the page URL.
> For a complete documentation index, see https://developers.webflow.com/llms.txt.
> For AI client integration (Claude Code, Cursor, etc.), connect to the MCP server at https://developers.webflow.com/_mcp/server.

# Rename the base variable mode

> The base variable mode is now first-class in the Designer API

The base variable mode — the default set of values that variables fall back to — is now first-class in the Designer API. It has the reserved ID `"base"` and, by default, the name `"Base mode"`.

You can now work with the base mode like any other mode:

* **Rename it** with [`mode.setName()`](/designer/reference/set-variable-mode-name). Its ID stays `"base"` even after it's renamed.
* **Retrieve it by ID** with [`collection.getVariableModeById("base")`](/designer/reference/get-variable-mode-by-id), or by its (default or renamed) name with [`collection.getVariableModeByName()`](/designer/reference/get-variable-mode-by-name).

```typescript
// Get the default variable collection
const collection = await webflow.getDefaultVariableCollection()

// Get the base mode by its reserved ID and rename it
const baseMode = await collection.getVariableModeById("base")
console.log(await baseMode?.getName()) // "Base mode"
await baseMode?.setName("Light")
```

## Behavior change: `getAllVariableModes` includes the base mode

[`collection.getAllVariableModes()`](/designer/reference/get-all-variable-modes) now includes the base mode in the returned array (as the first entry). If your integration iterates over the result, it will now encounter the base mode — for example, when listing or counting a collection's modes.

```typescript
const collection = await webflow.getDefaultVariableCollection()
const modes = await collection.getAllVariableModes()

// The base mode is now part of this list
for (const mode of modes) {
  console.log(await mode.getName())
}
```

For more information, see [Variable Modes](/designer/reference/variable-modes).