HTML Color Codes
- 1%
- 2%
- 3%
- 4%
- 5%
- 6%
- 7%
- 8%
- 9%
- 10%
- 11%
- 12%
- 13%
- 14%
- 15%
- 16%
- 17%
- 18%
- 19%
- 20%
Digital color can be represented in a number of ways. The most common ways to represent color on the web are via a 6-digit HEX number, RGBA, and HSL (Support for HSL was added in CSS3).
- Hex is a 6-digit, 24 bit, hexidecimal number that represents Red, Green, and Blue. An example of a Hex color representation is
#123456
,12
is Red,34
is Green, and56
is Blue. There are 16 million possible colors. - RGBA is similar to Hex in that it has 24 bits for RGB color, bit there is an additional 8 bit value for transparency.
- HSL stands for Hue, Saturation, and Lightness. The values are based on a position from the center of a color wheel. The value for Hue is from 0 to 360, representing the degrees on a color wheel. Saturation is the distance from the center of the color wheel. The L stands for Lightness, which represents the preceived liminance of the color.
") .append("
HTML:#" + val.toUpperCase() +"RGB:" + r + "" + g + "" + b + "" + label + "" + inc + "
") .prependTo("#colorexamples");} // end if pure white or notinc = range * (i + 1) + "%";if ( shade == 'darken' ) {label= "DARKENED:";} else if (shade == 'tetrad') {label = "COMPLIMENT";inc = "";} else {label= "LIGHTENED:";}}); // end for each NewColors//var div = document.createElement("div");//$(div).addClass("row seperator")// .appendTo("#new_colors"); } // end if hex has 6 characters}); // end submit click function $(".dropdown-menu li a").click(function(){ $("#percent .ddtext").text($(this).text()); $("#percent").val($(this).text()); });$(".colorsave").click( function() {$('.exampletext').empty();var json = [];if (localStorage['saveColors']) {json = JSON.parse(localStorage['saveColors']);}var val = $("#hex").val().replace('#','');json.push(val);var div = document.createElement("div");$(div).addClass("color col span_2").append("
").append("
HTML:#" + val.toUpperCase() +"
").prependTo("#colorsaves");localStorage['saveColors'] = JSON.stringify(json);});$("#saveReset").click( function() {$("#colorsaves").empty();localStorage.removeItem('saveColors');});$("#workingReset").click( function() {$("#colorexamples").empty();});}); // end anonymous functionif (localStorage['saveColors']) {$("#colorsaves").empty();//var json = JSON.parse(localStorage['saveColors']);$.each(JSON.parse(localStorage['saveColors']), function (i, val) {var div = document.createElement("div");$(div).addClass("color col span_2").append("
").append("
HTML:#" + val.toUpperCase() +"
").appendTo("#colorsaves");});}});
Join to access discussion forums and premium features of the site.