The Clipboard API provides the ability to respond to clipboard commands (cut, copy, and paste) as well as to asynchronously read from and write to the system clipboard. Access to the contents of the clipboard is gated behind the Permissions API: The clipboard-write
permission is granted automatically to pages when they are in the active tab. The clipboard-read
permission must be requested, which you can do by trying to read data from the clipboard.
This API is designed to supersede accessing the clipboard using document.execCommand()
.
Accessing the clipboard
Instead of creating a Clipboard
object through instantiation, you access the system clipboard through the Navigator.clipboard
global:
navigator.clipboard.readText().then( clipText => document.querySelector(".editor").innerText += clipText);
This snippet fetches the text from the clipboard and appends it to the first element found with the class editor
. Since readText()
(and read()
, for that matter) returns an empty string if the clipboard isn't text, this code is safe.
Interfaces
Clipboard
Secure context- Provides an interface for reading and writing text and data to or from the system clipboard. The specification refers to this as the 'Async Clipboard API.'
ClipboardEvent
Secure context- Represents events providing information related to modification of the clipboard, that is
cut
,copy
, andpaste
events. The specification refers to this as the 'Clipboard Event API'. ClipboardItem
Secure context- Represents a single item format, used when reading or writing data.
Specifications
Specification | Status | Comment |
---|---|---|
Clipboard API and events | Working Draft | Initial definition. |
Browser compatibility
Clipboard
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
Clipboard | Chrome Full support 66 | Edge Full support 79 | Firefox Full support 63 | IE No support No | Opera Full support 53 | Safari Full support 13.1 | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android Full support 63 | Opera Android Full support 47 | Safari iOS Full support 13.4 | Samsung Internet Android Full support 9.0 |
read | Chrome
Partial support
76
| Edge Full support 79 | Firefox
Full support
63
| IE No support No | Opera Full support 63 | Safari Full support 13.1 | WebView Android
Partial support
84
| Chrome Android
Partial support
84
| Firefox Android
Full support
63
| Opera Android Full support 54 | Safari iOS Full support 13.4 | Samsung Internet Android Full support 12.0 |
readText | Chrome Full support 66 | Edge Full support 79 | Firefox
Full support
63
| IE No support No | Opera Full support 53 | Safari Full support 13.1 | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android
Full support
63
| Opera Android Full support 47 | Safari iOS Full support 13.4 | Samsung Internet Android Full support 9.0 |
write | Chrome
Full support
66
| Edge Full support 79 | Firefox
Full support
63
| IE No support No | Opera Full support 63 | Safari Full support 13.1 | WebView Android
Full support
66
| Chrome Android
Full support
66
| Firefox Android
Full support
63
| Opera Android Full support 54 | Safari iOS Full support 13.4 | Samsung Internet Android Full support 12.0 |
writeText | Chrome Full support 66 | Edge Full support 79 | Firefox
Full support
63
| IE No support No | Opera Full support 53 | Safari Full support 13.1 | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android
Full support
63
| Opera Android Full support 47 | Safari iOS Full support 13.4 | Samsung Internet Android Full support 9.0 |
Legend
- Full support
- Full support
- Partial support
- Partial support
- No support
- No support
- See implementation notes.
- See implementation notes.
- User must explicitly enable this feature.
- User must explicitly enable this feature.
ClipboardEvent
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
ClipboardEvent | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 22 | IE Full support 4 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 22 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
ClipboardEvent() constructor | Chrome Full support 58 | Edge Full support ≤79 | Firefox Full support 22 | IE ? | Opera Full support 45 | Safari ? | WebView Android Full support 58 | Chrome Android Full support 58 | Firefox Android Full support 22 | Opera Android Full support 43 | Safari iOS ? | Samsung Internet Android Full support 7.0 |
clipboardData | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 22 | IE Full support 5 | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support 22 | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- Compatibility unknown
- Compatibility unknown
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.
ClipboardItem
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
ClipboardItem | Chrome Full support 66 | Edge Full support ≤79 | Firefox No support No | IE No support No | Opera Full support Yes | Safari No support No | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android No support No | Opera Android Full support Yes | Safari iOS No support No | Samsung Internet Android Full support Yes |
ClipboardItem() constructor | Chrome Full support 66 | Edge Full support ≤79 | Firefox No support No | IE No support No | Opera Full support Yes | Safari No support No | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android No support No | Opera Android Full support Yes | Safari iOS No support No | Samsung Internet Android Full support Yes |
getType | Chrome Full support 66 | Edge Full support ≤79 | Firefox No support No | IE No support No | Opera Full support Yes | Safari No support No | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android No support No | Opera Android Full support Yes | Safari iOS No support No | Samsung Internet Android Full support Yes |
types | Chrome Full support 66 | Edge Full support ≤79 | Firefox No support No | IE No support No | Opera Full support Yes | Safari No support No | WebView Android Full support 66 | Chrome Android Full support 66 | Firefox Android No support No | Opera Android Full support Yes | Safari iOS No support No | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- No support
- No support
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.