> This page is for Designer API.

> 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.

# User changes pseudo mode of Designer

> User Event. Use this method to start listening for specific events in your App. In this case, we're listening for when a user changes the pseudo mode of the Designer.

## `webflow.subscribe("pseudomode", callback)`

Use this method to start listening for when a user changes the [pseudo-state](https://help.webflow.com/hc/en-us/articles/33961301727251-States) of the Designer.

### Syntax

```typescript
webflow.subscribe(
  event: "pseudomode",
  callback: (pseudoState: PseudoStateKey) => void
): Unsubscribe;
```

#### Pseudo-State Key Values

| Pseudo-State      | Designer State     | Description                                        |
| :---------------- | :----------------- | :------------------------------------------------- |
| `hover`           | Hover              | Element is hovered over by the mouse               |
| `pressed`         | Pressed            | Element is in pressed state                        |
| `visited`         | Visited            | **Link** element has been visited                  |
| `focus`           | Focused            | Element has keyboard/input focus                   |
| `focus-visible`   | Focused (Keyboard) | Element has keyboard focus with visible indicator  |
| `focus-within`    | --                 | Element or its descendant has focus                |
| `placeholder`     | Placeholder        | Placeholder text in form block inputs              |
| `first-child`     | First Item         | First Collection Item in a collection list         |
| `last-child`      | Last Item          | Last Collection Item in a collection list          |
| `nth-child(odd)`  | Odd Items          | Odd-numbered Collection Item in a collection list  |
| `nth-child(even)` | Even Items         | Even-numbered Collection Item in a collection list |

### Parameters

* **event**: `"pseudomode"` - The event to listen for.
* **callback**: `(pseudoState: PseudoStateKey) => void` - The callback function to execute when the event occurs. The `pseudoState` parameter is the new pseudo-state of the Designer.

### Returns

**Return Value**

***`Unsubscribe`***

This is a special function you receive after subscribing. When you no longer want to listen to the event, call this function to stop receiving notifications.

#

### Example

```typescript
// Subscribe to changes in the pseudo state
const pseudoStateCallback = (pseudoState: PseudoStateKey) => {
  console.log('Pseudo State:', pseudoState);
}

const unsubscribePseudoState = webflow.subscribe('pseudomode', pseudoStateCallback);
```

[Try this example](https://webflow.com/oauth/authorize?response_type=code\&client_id=19511de1ec410f9228d8dcbc9420e67916dea80d86d18f0c9a533eb475ea0f62)

### Designer Ability

| Designer Ability    | Locale | Branch | Workflow | Sitemode |
| :------------------ | :----- | :----- | :------- | :------- |
| **canAccessCanvas** | Any    | Any    | Any      | Any      |