I'm trying to copy an element's background color on-click. I'm getting the computed rgb value, but what I need copied to the clipboard is var(--primary)
https://codepen.io/avviodigital/pen/WNZNOVb
const copyToClipboard = str => {
const el = document.createElement('textarea');
el.value = str;
document.body.appendChild(el);
el.select();
document.execCommand('copy');
document.body.removeChild(el);
};
jQuery('.card').click( function () {
color = $(this).css( "background-color" );
copyToClipboard(color);
});body {
--primary: #7306f9;
}
.card {
background-color: var(--primary);
height: 50px;
width: 50px;
}<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<div class="card"></div>