[adinserter block=”1″]
Often times in Google Sheets we need to get the hexadecimal codes for colors (also known as the HTML color code) in Google Sheets, but it doesn’t seem straightforward or easy.
First things first, hex codes are otherwise known as HTML color codes. They start with a # character and contain 9 letters and numbers after it. For some colors with repeated character patterns, they can be shortened to only 3 characters. For example, black’s (#000000) shorthand is #000 and orange’s (#ff6600) shorthand is #f60.
Here in this short tutorial, you’ll learn how to build a script that can display the hexadecimal code for colors in Google Sheets.
If you just want a spreadsheet with the hexcodes for every color in the Google Sheets color picker, here’s a link to a pre-made template.
What you need to know
- You understand the fundamentals of Google Sheets.
- You understand HTML color codes and how to use them.
- Have a basic understanding of App Scripts
1. Create a spreadsheet with your colors
The code we’re going to write will use the background color of the cell you specify, so set the background colors of the cells you want the hexcodes for.
2. Custom function to return the hex code for the background color
In the script editor (Extensions -> Apps Script), enter the code below and deploy as a Library.
/**
* Returns the hexcode for the background color of a cell.
*/
function cellHex(row, col) {
var background = SpreadsheetApp.getActive().getDataRange().getCell(row, col).getBackground();
return background;
}
This code works by taking the values passed in (row and col) and getting the background hex color.
With this code as an Apps Script, you can call this function from a cell and return a value for it to display.
The comment block at the top of the function tells Google Sheets what to display in the help box as you use your function.
3. Use your new function to return the hex code
Now you can use your new cellHex()
function to return the hexadecimal color code for the selected cell.
In the cell you want to display the color code in, enter your function like this =cellHex(ROW(B10), COLUMN(B10))
where you reference the cell with the background color in the ROW
and COLUMN
parenthesis.
Example Template
For an example of how I use this function to get the HTML color in Google Sheets, take a look at this pre-made template for every color in the Google Sheets color picker.
Hex Codes for all the colors in the Google Sheets color picker
#000000
#434343
#666666
#999999
#b7b7b7
#cccccc
#d9d9d9
#efefef
#f3f3f3
#ffffff
#980000
#ff0000
#ff9900
#ffff00
#00ff00
#00ffff
#4a86e8
#0000ff
#9900ff
#ff00ff
#e6b8af
#f4cccc
#fce5cd
#fff2cc
#d9ead3
#d0e0e3
#c9daf8
#cfe2f3
#d9d2e9
#ead1dc
#dd7e6b
#ea9999
#f9cb9c
#ffe599
#b6d7a8
#a2c4c9
#a4c2f4
#9fc5e8
#b4a7d6
#d5a6bd
#a61c00
#cc0000
#e69138
#f1c232
#6aa84f
#45818e
#3c78d8
#3d85c6
#674ea7
#a64d79
#85200c
#990000
#b45f06
#bf9000
#38761d
#134f5c
#1155cc
#0b5394
#351c75
#741b47
#5b0f00
#660000
#783f04
#7f6000
#274e13
#0c343d
#1c4587
#073763
#20124d
#4c1130
#000000
#ffffff
#4285f4
#ea4335
#fbbc04
#34a853
#ff6d01
#46bdc6
I hope this tutorial helps you wherever you need to get the hexadecimal code from your cell’s background in your templates.