HTML Entities

Master techniques for rendering protected characters and specialized glyphs within markup content

Protected HTML characters require entity substitution for proper display. Additionally, keyboard-unavailable characters become accessible through entity notation systems.

What are HTML Entities?

Some characters are reserved in HTML. If you use the less than (<) or greater than (>) signs in your text, the browser might mix them with tags.

Character entities are used to display reserved characters in HTML.

Entity Syntax

An entity can be written in two ways:

  • Entity Name: &entity_name;
  • Entity Number: &#entity_number;

Example - Displaying Less Than Sign

<p>To display a less than sign, use &lt; or &#60;</p>

Result:

To display a less than sign, use < or <

Tip: Using entity names is easier to remember, but not all browsers support all entity names. However, entity numbers are supported by all browsers.

Non-breaking Space

A commonly used entity in HTML is the non-breaking space: &nbsp;

A non-breaking space is a space that will not break into a new line. Two words separated by a non-breaking space will stick together (not break into a new line).

Example - Non-breaking Space

<p>This is paragraph 1.</p>
<p>This is paragraph&nbsp;2.</p>

Common Uses:

  • Prevent line breaks between words (e.g., "10 km")
  • Add multiple spaces (HTML normally collapses multiple spaces into one)
  • Keep related items together (e.g., "Mr. Smith")

Common HTML Entities

Here are the most commonly used character entities in HTML:

Result Description Entity Name Entity Number
non-breaking space &nbsp; &#160;
< less than &lt; &#60;
> greater than &gt; &#62;
& ampersand &amp; &#38;
" double quotation mark &quot; &#34;
' single quotation mark &apos; &#39;
¢ cent &cent; &#162;

Currency Symbols

Result Description Entity Name Entity Number
¢ cent &cent; &#162;
£ pound &pound; &#163;
¥ yen &yen; &#165;
€ euro &euro; &#8364;

Example - Currency Symbols

<p>The price is &euro;50 or &pound;43 or &yen;5500</p>

Result:

The price is €50 or £43 or ¥5500

Mathematical Symbols

Result Description Entity Name Entity Number
× multiplication &times; &#215;
÷ division &divide; &#247;
± plus-minus &plusmn; &#177;
≠ not equal &ne; &#8800;
≤ less than or equal to &le; &#8804;
≥ greater than or equal to &ge; &#8805;

Example - Math Symbols

<p>5 &times; 3 = 15</p>
<p>10 &divide; 2 = 5</p>
<p>x &ne; 0</p>

Result:

5 × 3 = 15

10 ÷ 2 = 5

x ≠ 0

Other Common Symbols

Result Description Entity Name Entity Number
© copyright &copy; &#169;
® registered trademark &reg; &#174;
™ trademark &trade; &#8482;
§ section &sect; &#167;
° degree &deg; &#176;
• bullet &bull; &#8226;

Example - Common Symbols

<p>&copy; 2025 My Company</p>
<p>HTML Free Codes&reg;</p>
<p>The temperature is 25&deg;C</p>

Result:

© 2025 My Company

HTML Free Codes®

The temperature is 25°C

Diacritical Marks

Diacritical marks (accents) are added to letters. Some diacritical marks are available as separate entities in HTML.

Mark Character Entity Name Entity Number
acute accent á &aacute; &#225;
grave accent à &agrave; &#224;
circumflex â &acirc; &#226;
tilde ñ &ntilde; &#241;
umlaut ü &uuml; &#252;
cedilla ç &ccedil; &#231;

Example - Diacritical Marks

<p>Caf&eacute; is a French word.</p>
<p>He visited Espa&ntilde;a (Spain).</p>
<p>N&uuml;rnberg is a city in Germany.</p>

Result:

Café is a French word.

He visited España (Spain).

Nürnberg is a city in Germany.

Combining Diacritical Marks

A combining character is a character that is placed on top of another character. These are called combining diacritical marks.

Example - Combining Marks

<p>a&#768; a&#769; a&#770; a&#771;</p>

Result:

à á â ã

Practical Examples

Example - Displaying HTML Code

<p>To create a heading, use &lt;h1&gt;Your Heading&lt;/h1&gt;</p>
<p>The &lt;p&gt; tag defines a paragraph.</p>

Example - Legal and Copyright

<footer>
    <p>&copy; 2025 My Company&reg;. All rights reserved.</p>
    <p>Product Name&trade;</p>
</footer>

Example - Scientific Notation

<p>E = mc<sup>2</sup></p>
<p>H<sub>2</sub>O</p>
<p>Temperature range: -10&deg;C to 35&deg;C</p>

Best Practices for Using Entities

✓ Tips

  • Always use entities for reserved characters (<, >, &, ")
  • Use entities for special characters not on your keyboard
  • Entity names are easier to remember than numbers
  • Entity numbers have better browser support
  • Use UTF-8 charset to support most characters without entities
  • Use &nbsp; to prevent unwanted line breaks
  • Consider using Unicode directly if UTF-8 is enabled

Test Your Knowledge