Skip to main content

How to Convert a Number to Hexadecimal in JavaScript

Converting numbers to their hexadecimal (base-16) string representation is a common task, especially when working with colors, character encodings, or low-level data. JavaScript provides a simple and direct way to perform this conversion using the built-in toString() method of the Number prototype.

This guide will teach you how to convert any number to a hexadecimal string, the correct syntax for doing so, and how to perform the inverse operation of parsing a hex string back into a number.

Core Method: Number.prototype.toString()​

The standard way to convert a number to a string in a different numerical base is to use the toString() method, which accepts an optional radix (or base) argument.

Logic: To convert a number to hexadecimal, you call toString() on it and pass 16 as the radix.

const myNumber = 255;
const hexString = myNumber.toString(16); // The '16' specifies a base-16 (hexadecimal) conversion.

Problem: we have a standard decimal number and need its hexadecimal string equivalent.

// Problem: How to convert this number to hex?
const num = 42;

Example of a working solution:

const num = 42;
const hex = num.toString(16);

console.log(hex);  // Output: "2a"

const num2 = 65535;
const hex2 = num2.toString(16);

console.log(hex2); // Output: "ffff"
note

The hexadecimal system uses the digits 0-9 and the letters a-f to represent values 0 through 15. The toString(16) method handles this conversion automatically.

A Note on Syntax: Calling toString() on Number Literals​

A common syntax error occurs when you try to call toString() directly on a number literal.

Example of code with error:

// This will cause a SyntaxError.
const hex = 42.toString(16);
note

This fails because the JavaScript parser interprets the dot (.) after the 42 as a decimal point, not as a property accessor.

Solution: you must wrap the number literal in parentheses to clarify that you are accessing a method on the Number object.

// This is the correct syntax.
const hex = (42).toString(16);

console.log(hex); // Output: "2a"

The Inverse: Parsing a Hex String Back to a Number​

To convert a hexadecimal string back into a number, you use the global parseInt() function, which takes two arguments: the string to parse and the radix (base) to interpret it from.

Logic: to parse a hexadecimal string, you call parseInt() and pass 16 as the radix.

const hexString = "2a";
const number = parseInt(hexString, 16); // The '16' specifies the input is base-16.

console.log(number);  // Output: 42

const hexString2 = "ffff";
const number2 = parseInt(hexString2, 16);

console.log(number2); // Output: 65535

You can also parse hex strings prefixed with 0x:

console.log(parseInt('0x2a', 16)); // Output: 42

Practical Example: A Complete Conversion Cycle​

For cleaner code, it's a good practice to wrap this logic in reusable functions. This example shows a complete "round-trip" from a number to hex and back again.

function toHex(num) {
  return num.toString(16);
}

function fromHex(hexStr) {
  return parseInt(hexStr, 16);
}

// Example Usage:
const originalNumber = 123456;
console.log('Original Number:', originalNumber);  // Original Number: 123456

// Convert to hex
const hexValue = toHex(originalNumber);
console.log('Hex Value:', hexValue);              // Output: Hex Value: 1e240

// Convert back to number
const finalNumber = fromHex(hexValue);
console.log('Final Number:', finalNumber);        // Output: Final Number: 123456

console.log(originalNumber === finalNumber);      // Output: true

Conclusion​

Converting numbers to and from hexadecimal is a straightforward process in JavaScript thanks to its powerful built-in functions.

  • To convert a number to a hexadecimal string, use the number.toString(16) method.
  • To convert a hexadecimal string to a number, use the parseInt(hexString, 16) function.
  • Remember to wrap number literals in parentheses when calling toString() on them directly: (100).toString(16).

Table of Contents