<input class="copy" type="text" value="copy this text"> <button class="copy">copy</button> <input class="paste" type="text" value="paste here"> <button class="paste">paste</button> const inputCopy = document.querySelector('input.copy') const btnCopy = document.querySelector('button.copy') const inputPaste = document.querySelector('input.paste') const btnPaste = document.querySelector('button.paste') btnCopy.onclick = async () => { await navigator.clipboard.writeText(inputCopy.value) console.log('copied!'); } btnPaste.onclick = async () => { const clipText = await navigator.clipboard.readText() inputPaste.value = clipText console.log('pasted!'); }
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter