sábado, 13 de julio de 2013

Convertir color hexadecimal a rgb online


El siguiente script permite obtener el código rgb de un color a partir de su código hexadecimal.

El modelo de colores rgb hace referencia a la composición de los tres colores básicos ...

r = red
g = green
b = blue

A partir de la mezcla de estos colores según su proporción, en una escala de 0 a 255, se obtienen el resto de colores conocidos, por ejemplo el color blanco se define (255, 255, 255) y el color negro (0, 0, 0) siguiendo el orden rgb(red, green, blue)

Convertir color hexadecimal a rgb online




R: G: B:



Código del conversor rgb ...

<!-- By http://jquery-manual.blogspot.com -->
<!DOCTYPE HTML>
<html>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script type="text/javascript">
function hexToR(h) { return parseInt((cutHex(h)).substring(0,2),16) }
function hexToG(h) { return parseInt((cutHex(h)).substring(2,4),16) }
function hexToB(h) { return parseInt((cutHex(h)).substring(4,6),16) }
function cutHex(h) { return (h.charAt(0)=="#") ? h.substring(1,7) : h}

$(function(){
$("#btn_rgb").click(function(){
hexadecimal = document.getElementById("hex").value;
document.getElementById("box_color").style.backgroundColor = "#"+hexadecimal;
document.getElementById("r").value = hexToR(hexadecimal);
document.getElementById("g").value = hexToG(hexadecimal);
document.getElementById("b").value = hexToB(hexadecimal);
});
});
</script>
</head>
<body>
<center>
<div id="box_color" style="border: 1px solid black; height: 50px; width: 50px;">
</div>
<br />
<form name="rgb">
<input id="hex" maxlength="7" name="hex" size="7" type="text" value="FFFFFF" />
<input id="btn_rgb" type="button" value="Convertir hexadecimal a RGB" />
R:<input id="r" size="3" style="width: 33px;" type="text" />
G:<input id="g" size="3" style="width: 33px;" type="text" />
B:<input id="b" size="3" style="width: 33px;" type="text" />
</form>
</center>
</body>
</html>