Copy to clipboard

Allow users to quickly copy text or data to their clipboard with a single click.

When to use

Use this pattern when:

• Users need to copy values like tokens, codes, or IDs
• Quick access to copy functionality improves workflow
• The copied value is clearly visible alongside the copy action
• Users benefit from instant feedback when copying

Considerations

• Show visual feedback (“Copied”) when the copy action succeeds
• Use a tooltip to indicate the copy action before and after clicking
• Position the copy button near the content being copied
• Reset the “Copied” state after a short delay