> For the complete documentation index, see [llms.txt](https://help.adalo.com/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://help.adalo.com/component-basics/marketplace-components/copy-to-clipboard-button.md).

# Copy To Clipboard Button

A tappable button that instantly copies any text to the device clipboard. Perfect for invite codes, referral links, wallet addresses, coupon codes, tracking numbers, or any value your users need to share or paste elsewhere — no long-press or system menu required.

## Getting Started

Add the component to any screen and connect the **Text to Copy** field to the value you want copied — a Magic Text binding works great here. Resize the component to define the button area, then style the icon, colors, and corner radius to match your app. When a user taps the button, the text is copied silently and the icon briefly flips to a checkmark to confirm.

## Settings

### Text to Copy

The text that gets copied to the clipboard when the button is tapped. Use Magic Text to bind this to any database field — for example, a user's referral code, a booking confirmation number, or a shareable URL. (default: empty)

### Icon

The Material icon shown on the button. Defaults to the clipboard icon (`content-copy`). You can change this to any Material icon name — for example, `share`, `link`, `content-paste`, or `file-copy`. (default: content-copy)

### Icon Color

The color of the icon. Use a contrasting color to your background for best readability. (default: white)

### Icon Size

The size of the icon in pixels, from 12 to 48. Adjust this alongside the component size — a larger component can comfortably fit a larger icon. (default: 24)

### Background Color

The fill color of the button container. (default: #5C6BC0, indigo)

### Corner Radius

Controls how rounded the button corners are, from 0 (sharp square) to 50 (full circle). Set to 50 for a pill or circular button. (default: 8)

## Tips & Best Practices

* **Bind Text to Copy to a database field** — use Magic Text to pull in a referral code, order ID, share link, or any value the user needs to copy. Static text works too if you want a fixed string.
* **Size the component to define the button** — the button fills the component's bounding box, so drag the edges to make it bigger or smaller rather than adjusting padding.
* **Set Corner Radius to 50 for a circular button** — works great for icon-only buttons placed beside a text field.
* **Match the background color to your app's accent color** — the component uses your chosen color directly, so it blends naturally with your design system.
* **The checkmark flash is the confirmation** — no toast or alert is needed. The 1.5-second checkmark animation gives users clear visual feedback without interrupting their flow.
* **Pair it with a visible text field** — placing the button beside a read-only text field showing the value makes it obvious what will be copied.
* **Test on device before publishing** — clipboard behavior can vary slightly by platform. The component uses the native clipboard API on each platform for maximum reliability.

## Example Use Cases

**Referral program screen** — Bind Text to Copy to the logged-in user's referral code field. Place the button next to a text label showing the code. Users tap once to copy and share with friends.

**Booking confirmation** — On a confirmation screen, bind Text to Copy to the booking reference number. Users can paste it directly into email or messaging apps.

**Crypto or payment apps** — Display a wallet address or payment ID and let users copy it with one tap — avoids typos from manual entry.

**Coupon or promo code listings** — Add the button to each item in a list, bound to the code field. Users copy the code they want without leaving the screen.

**Share link generator** — Bind Text to Copy to a dynamically generated URL (built with Magic Text). Users tap to copy the link and paste it anywhere.


---

# Agent Instructions
This documentation is published with GitBook. GitBook is the documentation platform designed so that both humans and AI agents can read, navigate, and reason over technical content effectively. Learn more at gitbook.com.

## Querying This Documentation
If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.adalo.com/component-basics/marketplace-components/copy-to-clipboard-button.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
