.hue-slider{-webkit-appearance:none;cursor:pointer;background:linear-gradient(90deg,red,#ff0,#0f0,#0ff,#00f,#f0f,red);border:none;border-radius:6px;outline:none;width:300px;height:30px}.hue-slider::-webkit-slider-thumb{-webkit-appearance:none;background:hsl(--primary-hue,100%,50%);cursor:pointer;border:2px solid #ccc;border-radius:50%;width:40px;height:40px;margin-top:-3px}.hue-slider::-moz-range-thumb{cursor:pointer;background-color:#fff;border:2px solid #ccc;border-radius:50%;width:24px;height:24px}
.chroma-slider{-webkit-appearance:none;cursor:pointer;background:linear-gradient(90deg,#fff,#000);background:linear-gradient(to right,hsl(--primary-hue,0%,50%),hsl(--primary-hue,100%,50%));border:none;border-radius:6px;outline:none;width:300px;height:30px}.chroma-slider::-webkit-slider-thumb{-webkit-appearance:none;background:--currentColor;cursor:pointer;border:2px solid #ccc;border-radius:50%;width:40px;height:40px;margin-top:-3px}.chroma-slider::-moz-range-thumb{cursor:pointer;background-color:#fff;border:2px solid #ccc;border-radius:50%;width:24px;height:24px}