Why a copy button
Selecting long numbers by long-press is hard on mobile; a button makes it one tap. The web Clipboard API (MDN, n.d.-a) needs HTTPS and a user gesture. Copy exactly what is shown and decide on spaces or hyphens.
'Copied' feedback
Immediate response builds trust (Miller, 1968). Swap the icon to a check or show a brief toast (Apple, n.d.; Google, n.d.). writeText returns a Promise (MDN, n.d.-b), so report failures. Android 13+ shows its own confirmation, so avoid duplicates (Android Developers, n.d.). Light haptic feedback helps.
Security and accessibility
Treat passwords and codes carefully since other apps may read the clipboard; Android offers a sensitive-content flag. Name buttons like 'Copy coupon code' and announce 'Copied' per WCAG 2.2 (W3C, 2023) 4.1.3.
FAQ
- Is a toast always needed?
- Sometimes an icon change suffices; avoid duplicating Android 13+ notices.
- Should spaces be copied?
- Decide by destination; digits only usually suits account numbers.
Sources reviewed: 2026-10-27
References
- MDN Web Docs. (n.d.-a). Clipboard API. Clipboard access and security conditions.
- MDN Web Docs. (n.d.-b). Clipboard: writeText() method. writeText returns a Promise.
- Android Developers. (n.d.). Copy and paste. Avoid duplicate confirmations on Android 13+.
- Apple. (n.d.). Feedback. Human Interface Guidelines. Clear, unobtrusive feedback.
- Google. (n.d.). Snackbar. Material Design 3. Brief confirmation messages.
- Miller, R. B. (1968). Response time in man-computer conversational transactions. In Proceedings of the December 9–11, 1968, Fall Joint Computer Conference, Part I (pp. 267–277). ACM. Immediate response thresholds.
- World Wide Web Consortium. (2023). Web Content Accessibility Guidelines (WCAG) 2.2. Criterion 4.1.3 status messages.
