color input field

This is a color input field that supports opacity

const colorInput = preview.querySelector('tosi-color')
const circle = preview.querySelector('div')

colorInput.addEventListener('change', () => {
  circle.style.background = colorInput.value
})
<tosi-color value="red"></tosi-color>
<div
  style="
    width: 200px;
    height: 200px;
    background: red;
    border-radius: 100px;
  "
></div>