Edit in JSFiddle

function getColor() {
    document.getElementById("colorHex").innerHTML = 'HEX : ' + document.getElementById("inputColor").value;
    document.getElementById("colorRGB").innerHTML = 'RGB : '+ hexToRgb(document.getElementById("inputColor").value);
}
function hexToRgb(hex) {
    var result = /^#?([a-f\d]{2})([a-f\d]{2})([a-f\d]{2})$/i.exec(hex);
    var r = parseInt(result[1], 16);
    var g = parseInt(result[2], 16);
    var b = parseInt(result[3], 16);
    return 'RGB('+r+','+g+','+b+')'; 
}

<h3>Pick a Color:</h3>
<input id="inputColor" type="color" value="#ff1a1a"/>
<button onclick="getColor()">Get Color</button>
<p id="colorHex"></p>
<p id="colorRGB"></p>

input{
  width:20%;
  cursor: pointer;
}

button{
  height:27px;
}