This content has been automatically translated from Ukrainian.
Colors in HEX format are most commonly used in HTML, CSS, and graphic design. But sometimes it is necessary to convert them to RGB.
HEX Format
HEX color code consists of # and six characters (for example, #FF5733). The first two characters represent the intensity of red, the next two represent green, and the last two represent blue.
How to Manually Convert HEX to RGB
HEX code is a hexadecimal number, while in RGB each component is represented in decimal. To convert HEX to RGB:
-
Split the HEX code into three parts: For example,
#FF5733→FF,57,33. -
Convert each part to decimal:
-
FF(red) =255 -
57(green) =87 -
33(blue) =51
-
-
Get the RGB value:
rgb(255, 87, 51).
JavaScript Code Example
function hexToRgb(hex) {
hex = hex.replace(/^#/, "");
if (hex.length === 3) {
hex = hex.split("").map(c => c + c).join("");
}
let bigint = parseInt(hex, 16);
return `rgb(${(bigint >> 16) & 255}, ${(bigint >> 8) & 255}, ${bigint & 255})`;
}
console.log(hexToRgb("#FF5733")); // rgb(255, 87, 51)
Converting HEX to RGB is not a complicated process. It is enough to know that HEX is just another format for representing color that can be easily converted to decimal. This is a useful skill for web developers and designers.
We have a separate page where you can convert HEX to RGB.