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

# Get Component

> Retrieves the associated component of the element.

## `element.getComponent()`

Retrieves the associated [component definition](/designer/reference/components-overview#component-definition) of the component instance.

## Syntax

```typescript
element.getComponent(): Promise<Component>
```

## Returns

**Promise\<*Component*>**

A Promise that resolves to a [Component Object](/designer/reference/components-overview)

## Example

```typescript
// Select Component Element on Page
const elements = await webflow.getAllElements()
const componentInstance = elements.find(el => el.type === 'ComponentInstance')

if (componentInstance?.type === "ComponentInstance") {

  // Get Component object from instance
  const component = await componentInstance?.getComponent()
  const componentName = await component.getName()
  console.log(componentName)
} else {
  console.log("No component element found")
}
```

## Designer Ability

Checks for authorization only

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

```
```