A limited selection of named and numeric HTML entities, and Google / Font Awesome icons, with instructions on how to use them.

You can find the complete lists in various places. I like to go to W3Schools for my information. There you will find references for HTML named and numeric entities, UTF-8 numeric entities, and numeric entities for three different sets of icons. Both hexadecimal and decimal is provided here. (NOTE: Information is not provided for Font Awesome 5, as you have to pay to use it. The FA 4 icons are free to use, however.)

In HTML you mark off an entity with an ampersand at the beginning and a semi-colon at the end. In-between, you use either just the name, or the hex number with a hash sign and an x, or the decimal number, with a hash sign. The browser will interpret that code as the symbol in question when displaying your page.

When using Font Awesome or Google Icons, you need to include the CSS library in the head section of your HTML. Examples are shown. A class is then applied to the i element, which is for italics, actually, but since you can't italicize an icon, but you can apply a class to the element, the i might as well stand for "icon". Coders will often also use span for this purpose.

 

HTML Entities

<p>The cent sign looks like &cent;.</p> <!-- Named entity -->

<p>The cent sign looks like &#xA2;.</p> <!-- Hex numeric entity -->

<p>The cent sign looks like &#162;.</p> <!-- Dec numeric entity -->

"

&quot;
&#x22;
&#34;

&

&amp;
&#x26;
&#38;

<

&lt;
&#x3C;
&#60;

>

&gt;
&#x3E;
&#62;

 

&nbsp;
&#xA0;
&#160;

¡

&iexcl;
&#xA1;
&#161;

¢

&cent;
&#xA2;
&#162;

£

&pound;
&#xA3;
&#163;

¤

&curren;
&#xA4;
&#164;

¥

&yen;
&#xA5;
&#165;

¦

&brvbar;
&#xA6;
&#166;

§

&sect;
&#xA7;
&#167;

©

&copy;
&#xA9;
&#169;

ª

&ordf;
&#xAA;
&#170;

«

&laquo;
&#xAB;
&#171;

¬

&not;
&#xAC;
&#172;

®

&reg;
&#xAE;
&#174;

°

&deg;
&#xB0;
&#176;

±

&plusmn;
&#xB1;
&#177;

²

&sup2;
&#xB2;
&#178;

³

&sup3;
&#xB3;
&#179;

µ

&micro;
&#xB5;
&#181;

&para;
&#xB6;
&#182;

¹

&sup1;
&#xB9;
&#185;

º

&ordm;
&#xBA;
&#186;

»

&raquo;
&#xBB;
&#187;

¼

&frac14;
&#xBC;
&#188;

½

&frac12;
&#xBD;
&#189;

¾

&frac34;
&#xBE;
&#190;

¿

&iquest;
&#xBF;
&#191;

À

&Agrave;
&#xC0;
&#192;

Á

&Aacute;
&#xC1;
&#193;

Â

&Acirc;
&#xC2;
&#194;

Ã

&Atilde;
&#xC3;
&#195;

Ä

&Auml;
&#xC4;
&#196;

Å

&Aring;
&#xC5;
&#197;

Æ

&AElig;
&#xC6;
&#198;

Ç

&Ccedil;
&#xC7;
&#199;

È

&Egrave;
&#xC8;
&#200;

É

&Eacute;
&#xC9;
&#201;

Ê

&Ecirc;
&#xCA;
&#202;

Ë

&Euml;
&#xCB;
&#203;

Ì

&Igrave;
&#xCC;
&#204;

Í

&Iacute;
&#xCD;
&#205;

Î

&Icirc;
&#xCE;
&#206;

Ï

&Iuml;
&#xCF;
&#207;

Ð

&ETH;
&#xD0;
&#208;

Ñ

&Ntilde;
&#xD1;
&#209;

Ò

&Ograve;
&#xD2;
&#210;

Ó

&Oacute;
&#xD3;
&#211;

Ô

&Ocirc;
&#xD4;
&#212;

Õ

&Otilde;
&#xD5;
&#213;

Ö

&Ouml;
&#xD6;
&#214;

×

&times;
&#xD7;
&#215;

Ø

&Oslash;
&#xD8;
&#216;

Ù

&Ugrave;
&#xD9;
&#217;

Ú

&Uacute;
&#xDA;
&#218;

Û

&Ucirc;
&#xDB;
&#219;

Ü

&Uuml;
&#xDC;
&#220;

Ý

&Yacute;
&#xDD;
&#221;

Þ

&THORN;
&#xDE;
&#222;

ß

&szlig;
&#xDF;
&#223;

à

&agrave;
&#xE0;
&#224;

á

&aacute;
&#xE1;
&#225;

â

&acirc;
&#xE2;
&#226;

ã

&atilde;
&#xE3;
&#227;

ä

&auml;
&#xE4;
&#228;

å

&aring;
&#xE5;
&#229;

æ

&aelig;
&#xE6;
&#230

ç

&ccedil;
&#xE7;
&#231;

è

&egrave;
&#xE8;
&#232;

é

&eacute;
&#xE9;
&#233;

ê

&ecirc;
&#xEA;
&#234;

ë

&euml;
&#xEB;
&#235;

ì

&igrave;
&#xEC;
&#236;

í

&iacute;
&#xED;
&#237;

î

&icirc;
&#xEE;
&#238;

ï

&iuml;
&#xEF;
&#239;

ð

&eth;
&#xF0;
&#240;

ñ

&ntilde;
&#xF1;
&#241;

ò

&ograve;
&#xF2;
&#242;

ó

&oacute;
&#xF3;
&#243;

ô

&ocirc;
&#xF4;
&#244;

õ

&otilde;
&#xF5;
&#245;

ö

&ouml;
&#xF6;
&#246;

÷

&divide;
&#xF7;
&#247;

ø

&oslash;
&#xF8;
&#248;

ù

&ugrave;
&#xF9;
&#249;

ú

&uacute;
&#xFA;
&#250;

û

&ucirc;
&#xFB;
&#251;

ü

&uuml;
&#xFC;
&#252;

ý

&yacute;
&#xFD;
&#253;

þ

&thorn;
&#xFE;
&#254;

ÿ

&yuml;
&#xFF;
&#255;

Œ

&OElig;
&#x152;
&#338;

œ

&oelig;
&#x153;
&#339;

Š

&Scaron;
&#x160;
&#352;

š

&scaron;
&#x161;
&#353;

Ÿ

&Yuml;
&#x178;
&#376;

ƒ

&fnof;
&#x192;
&#402;

π

&pi;
&#x3C0;
&#960;

&thinsp;
&#x2009;
&#8201;

&mdash;
&#x2014;
&#8212;

&lsquo;
&#x2018;
&#8216;

&rsquo;
&#x2019;
&#8217;

&sbquo;
&#x201A;
&#8218;

&ldquo;
&#x201C;
&#8220;

&rdquo;
&#x201D;
&#8221;

&bdquo;
&#x201E;
&#8222;

&dagger;
&#x2020;
&#8224;

&Dagger;
&#x2021;
&#8225;

&bull;
&#x2022;
&#8226;

&hellip;
&#x2026;
&#8230;

&permil;
&#x2030;
&#8240;

&prime;
&#x2032;
&#8242;

&Prime;
&#x2033;
&#8243;

&lsaquo;
&#x2039;
&#8249;

&rsaquo;
&#x203A;
&#8250;

&euro;
&#x20AC;
&#8364;

&incare;
&#x2105;
&8453;

&numero;
&#x2116;
&#8470;

&trade;
&#x2122;
&#8482;

&infin;
&#x221E;
&#8734;

&starf;
&#x2605;
&#9733;

&star;
&#x2606;
&#9734;

&phone;
&#x260E;
&#9742;

 
&#x262A;
&#9770;

 
&#x262E;
&#9774;

 
&#x262F;
&#9775;

 
&#x263A;
&#9786;

 
&#x263C;
&#9788;

 
&#x2654;
&#9812;

 
&#x2655;
&#9813;

 
&#x2656;
&#9814;

 
&#x2657;
&#9815;

 
&#x2658;
&#9816;

 
&#x2659;
&#9817;

 
&#x265A;
&#9818;

 
&#x265B;
&#9819;

 
&#x265C;
&#9820;

 
&#x265D;
&#9821;

 
&#x265E;
&#9822;

 
&#x265F;
&#9823;

&spades;
&#x2660;
&#9824;

&clubs;
&#x2663;
&#9827;

&hearts;
&#x2665;
&#9829;

&diams;
&#x2666;
&#9830;

 
&#x2669;
&#9833;

&sung;
&#x266A;
&#9834;

 
&#x266B;
&#9835;

 
&#x266C;
&#9836;

&flat;
&#x266D;
&#9837;

&natur;
&#x266E;
&#9838;

&sharp;
&#x266F;
&#9839;

 
&#x267B;
&#9851;

 
&#x267F;
&#9855;

 
&#x2698;
&#9880;

 
&#x269B;
&#9883;

 
&#x269C;
&#9884;

 
&#x2709;
&#9993;

 
&#x271D;
&#10013;

 
&#x2721;
&#10017;

 
&#x272A;
&#10026;

&sext;
&#x2736;
&#10038;

 

Google Icons

<html>
<head>
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet">
</head>
<body>
<p><i class="material-icons">&#x0000;</i></p>
</body>
</html>

 
&#xE01C;
&#57372;

 
&#xE028;
&#57384;

 
&#xE029;
&#57385;

 
&#xE052;
&#57426;

 
&#xE0CD;
&#57549;

 
&#xE147;
&#57671;

 
&#xE15C;
&#57692;

 
&#xE2C4;
&#58052;

 
&#xE2C6;
&#58054;

 
&#xE310;
&#58640;

 
&#xE312;
&#58642;

 
&#xE5C9;
&#58825;

 
&#xE838;
&#59448;

 
&#xE839;
&#59449;

 
&#xE83A;
&#59450;

 
&#xE887;
&#59527;

 
&#xE88A;
&#59530;

 
&#xE88E;
&#59534;

 
&#xE897;
&#59543;

 
&#xE8AD;
&#59565;

 
&#xE8DB;
&#59611;

 
&#xE8DC;
&#59612;

 
&#xE8E8;
&#59624;

 
&#xE8FF;
&#59647;

 
&#xE900;
&#59648;

 
&#xE90F;
&#59663;

 

Font Awesome

<html>
<head>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/css/font-awesome.min.css">
</head>
<body>
<p><i class="fa">&#x0000;</i></p>
</body>
</html>

 
&#xF008;
&#61448;

 
&#xF013;
&#61459;

 
&#xF02C;
&#61484;

 
&#xF02D;
&#61485;

 
&#xF02E;
&#61486;

 
&#xF030;
&#61488;

 
&#xF03D;
&#61501;

 
&#xF07A;
&#61562;

 
&#xF08D;
&#61581;

 
&#xF0A1;
&#61601;

 
&#xF0E9;
&#61673;

 
&#xF13D;
&#61757;

 
&#xF15B;
&#61787;

 
&#xF167;
&#61799;

 
&#xF179;
&#61817;

 
&#xF17B;
&#61819;

 
&#xF19A;
&#61850;

 
&#xF19C;
&#61852;

 
&#xF1BB;
&#61883;

 
&#xF1B9;
&#61881;

 
&#xF1C0;
&#61888;

 
&#xF1C1;
&#61889;

 
&#xF1CD;
&#61901;

 
&#xF1D1;
&#61905;

 
&#xF1F8;
&#61944;

 
&#xF204;
&#61956;

 
&#xF205;
&#61957;

 
&#xF230;
&#62000;

 
&#xF238;
&#62008;

 
&#xF25E;
&#62046;

 
&#xF266;
&#62054;

 
&#xF270;
&#62064;