Copying strings

Text strings

When a string of text must be copied, a copy icon can be placed next to the string. After clicking, the icon should change to a checkmark for one second. A toast saying “Copied” may be used as well.​​

Code Snippets

Code snippets by default have optional copy functionality that allows users to copy the provided code to their clipboard. See component documentation for more details.

Icon alignment

When copying a text string, place the copy icon to the right of the text.

When using a copy button the icon should be left aligned.

Using the verb “Copy”

“Copy” should be used in the button when possible, except when context is too short to include it.