You can apply the user-select CSS property to an element to control how it handles selecting text for copy and paste. This allows you to limit selecting text, or make it automatic. If you use the all property, anytime a user clicks on that element the text is automatically selected. This can be useful for keys or codes where the user is expected to copy and paste the text.

.click_select { user-select: all; }

Example:

Click me!

I needed a modern way to copy a string to the clipboard in JavaScript. Claude.ai helped me come up with this:

// With async/await
async function copyToClipboard(text) {
    try {
        await navigator.clipboard.writeText(text);
        console.log('Copied to clipboard');
    } catch (err) {
        console.error('Failed to copy: ', err);
    }
}

Then you simply call it with a string

copyToClipboard("Hello world");