Convert HEX to RGB & RGB to HEX Converter Jquery Functions

Whether in Web or Desktop application during we design a Color Picker we required Color Converter functions. Basically in the world of web we use 2 types of Color Codes. They are RGB and Hexadecimal (HEX). In this demo for your reference let us share “Convert HEX to RGB” & “RGB to HEX Converter” Jquery Functions.

RGB

RGB Color model stands for Red, Green and Blue Colors. Generally if you will watch the back view of a Color TV there you can saw 3 rays from CRT. Which hits phosphors or dyes to display the Colors. In RGB color model 0 intensity gives the most darkest color & full intensity presents white. To generate colors like Yellow we controls intensity of 3 rays (RGB). Type of RGB Devices are TV, Computer, Video Cameras or Scanners.

Hexadecimal (HEX)

Hexadecimal Color Code is also Called base 16 or HEX. Hexadecimal uses 0 to 9 integer or A to F Character values. While writing a Hexadecimal Color code we start with #. Example of Hexadecimal Color Code for White Color is #FFFFFF. It can be present in another way #FFF. Hexadecimal commonly used to represent Computer memory.

Look at the below examples. Here I created 2 JQuery functions “RGB to HEX” and “HEX to RGB”. Inside the function RGB to HEX I am using regular expression.

RGB to HEX Converter Jquery Function

/* RGB to HEX using Regular Expression */
function rgbToHexadecimal(rgb_color){
rgb_color = rgb_color.match(/^rgba?[\s+]?\([\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?,[\s+]?(\d+)[\s+]?/i);
return (rgb_color && rgb_color.length === 4) ? "#" +
("0" + parseInt(rgb_color[1],10).toString(16)).slice(-2) +
("0" + parseInt(rgb_color[2],10).toString(16)).slice(-2) +
("0" + parseInt(rgb_color[3],10).toString(16)).slice(-2) : '';
}

Convert HEX to RGB Jquery Function

function hexadecimalToRGB(hex_color)
{
var red_color = parseInt((onlyHex(hex_color)).substring(0,2),16), green_color = ((onlyHex(hex_color)).substring(2,4),16), blue_color = parseInt((onlyHex(hex_color)).substring(4,6),16)
return red_color + ',' + green_color + ',' + blue_color;
}

/* Supporting Function */
function onlyHex(hex_color) {return (hex_color.charAt(0)=="#") ? hex_color.substring(1,7):hex_color}