---
title: Clipboard item
description: >-
  Enables copying text to the user’s clipboard. Use alongside Button or Link
  components to let users easily copy content. `<s-clipboard-item>` doesn’t
  render visually.
api_version: 2026-01
api_name: customer-account-ui-extensions
source_url:
  html: >-
    https://shopify.dev/docs/api/customer-account-ui-extensions/2026-01/web-components/actions/clipboard-item
  md: >-
    https://shopify.dev/docs/api/customer-account-ui-extensions/2026-01/web-components/actions/clipboard-item.md
---

# Clipboard item

Enables copying text to the user’s clipboard. Use alongside Button or Link components to let users easily copy content. `<s-clipboard-item>` doesn’t render visually.

### Support Targets (24)

### Supported targets

* customer-account.​footer.​render-after
* customer-account.​order-index.​announcement.​render
* customer-account.​order-index.​block.​render
* customer-account.​order-status.​announcement.​render
* customer-account.​order-status.​block.​render
* customer-account.​order-status.​cart-line-item.​render-after
* customer-account.​order-status.​cart-line-list.​render-after
* customer-account.​order-status.​customer-information.​render-after
* customer-account.​order-status.​fulfillment-details.​render-after
* customer-account.​order-status.​payment-details.​render-after
* customer-account.​order-status.​return-details.​render-after
* customer-account.​order-status.​unfulfilled-items.​render-after
* customer-account.​order.​action.​menu-item.​render
* customer-account.​order.​action.​render
* customer-account.​order.​page.​render
* customer-account.​page.​render
* customer-account.​profile.​addresses.​render-after
* customer-account.​profile.​announcement.​render
* customer-account.​profile.​block.​render
* customer-account.​profile.​company-details.​render-after
* customer-account.​profile.​company-location-addresses.​render-after
* customer-account.​profile.​company-location-payment.​render-after
* customer-account.​profile.​company-location-staff.​render-after
* customer-account.​profile.​payment.​render-after

## Properties

* **id**

  **string**

  A unique identifier for the element.

* **text**

  **string**

  **Default: ''**

  Plain text to be written to the clipboard.

## Events

Learn more about [registering events](https://shopify.dev/docs/api/checkout-ui-extensions/latest/using-polaris-components#event-handling).

* **copy**

  **CallbackEventListener\<typeof tagName>**

  Callback run when the copy to clipboard succeeds.

* **copyerror**

  **CallbackEventListener\<typeof tagName>**

  Callback run when the copy to clipboard fails.

### CallbackEventListener

```ts
(EventListener & {
    (event: CallbackEvent<TTagName, Event> & TData): void;
}) | null
```

### CallbackEvent

```ts
TEvent & {
    currentTarget: HTMLElementTagNameMap[TTagName];
}
```

Examples

## Preview

![](https://cdn.shopify.com/shopifycloud/shopify-dev/development/assets/assets/images/templated-apis-screenshots/checkout-ui-extensions/2025-07/clipboard-basic-Ctmy24fF.png)

### Examples

* #### Code

  ##### Default

  ```html
  <s-button commandFor="discount-code">Copy discount code</s-button>
  <s-clipboard-item id="discount-code" text="SAVE 25"></s-clipboard-item>
  ```