Lorem ipsum dolor sit amet, consectetur adipiscing elit. Suspendisse varius enim in eros elementum tristique. Duis cursus, mi quis viverra ornare, eros dolor interdum nulla, ut commodo diam libero vitae erat. Aenean faucibus nibh et justo cursus id rutrum lorem imperdiet. Nunc ut sem vitae risus tristique posuere.

// Paste in body tag
<!-- Color picker script source-->
<script src="https://cdn.jsdelivr.net/npm/@jaames/iro/dist/iro.min.js"></script>
<!-- Color picker script code-->
<script>       
var colorPicker = new iro.ColorPicker(".input-colorpicker-wrapper", {        
width: 180,        
color: "rgb(255, 0, 0)",        
borderWidth: 5,       
borderColor: "#f5f5f5",    
});    
var values = document.getElementById("values-colors");    
var hexInput = document.getElementById("hexInput");    
var swatch = document.getElementById("colorSwatch");       
colorPicker.on(["color:init", "color:change"], function(color){        
values.innerHTML = [            
"hex: " + color.hexString,            
"rgb: " + color.rgbString,            
"hsl: " + color.hslString,        
].join("<br>");                
hexInput.value = color.hexString;        
swatch.style.backgroundColor = color.hexString;    
});    
hexInput.addEventListener('change', function() {        
colorPicker.color.hexString = this.value;        
swatch.style.backgroundColor = this.value;    
});
</script>

Not available

Upgrage to access the custom code @$14/ lifetime

Not available

Not available

This is a success message.
This is an error message.
This is also an error message.