HTML Entities


HTML entities are special codes that allow you to display characters that cannot be typed directly or have special meaning in HTML. Some characters are reserved, some are invisible, and some cannot be written using a keyboard. Entities help you display them correctly in your webpage. In this chapter, you will learn what HTML entities are, why they are needed, how to write them, and how to use the most common entity codes with examples.

What Are HTML Entities?

HTML entities are encoded versions of characters. Instead of typing the character directly, you write a specific code that the browser converts into the correct symbol. Entities always start with & and end with ;.

Example

<div>

The browser displays:

<div>

Entities are especially important for reserved HTML characters like < and > because the browser normally treats them as part of the HTML structure.

Why Do We Need HTML Entities?

Some characters cannot be used directly in HTML for different reasons. Entities solve these problems.

Reasons You Need Entities

  • to show reserved characters in text

  • to display special symbols not available on keyboards

  • to avoid conflicts with HTML syntax

  • to ensure characters display correctly in all browsers

  • to support various languages and mathematical symbols

Reserved characters like <, >, ", ', and & must be written as entities inside HTML content.

Basic Structure of Entities

Entities come in two forms:

1. Named Entities

These use a readable name.

&amp;   →  &
&quot;  →  "

2. Numeric Entities

These use a numeric code.

&#169;   → ©
&#9733;  → ★

Both versions work, but named entities are easier to remember.

Reserved Character Entities

These characters are part of the HTML language. If you write them normally, the browser might misinterpret them.

< and >

Used for HTML tags.

&lt;h1&gt;Title&lt;/h1&gt;

&

Used to start an entity.

&amp;  →  &

Quotes in attributes

&quot; → "
&apos; → '

Example

<p>Use &lt;strong&gt; for bold text.</p>

This prevents the browser from trying to render <strong> as actual HTML.

Displaying Copyright, Trademark and Symbols

HTML offers ready-made entities for common symbols.

Examples

&copy;   → ©
&reg;    → ®
&trade;  → ™
&euro;   → €
&pound;  → £
&yen;    → ¥

These symbols are used often in business websites and branding footers.

Mathematical Entities

Math symbols are not easy to type, so entities help you display them.

Common math entities

&plus;    → +
&minus;   → −
&times;   → ×
&divide;  → ÷
&radic;   → √
&sum;     → ∑
&infin;   → ∞

These are useful for teaching platforms, calculators and math content.

Currency Entities

Different currencies have their own entity codes.

&dollar;   → $
&euro;     → €
&pound;    → £
&yen;      → ¥
&cent;     → ¢

If your site deals with international pricing, these become essential.

Arrow Entities

Arrows are used for navigation tips, indicators, and instructions.

&larr;  → ←
&rarr;  → →
&uarr;  → ↑
&darr;  → ↓
&harr;  → ↔

These arrows help you guide users visually.

Space Entities

HTML removes extra spaces by default. To show spacing, you can use &nbsp; (non-breaking space).

Example

Hello&nbsp;&nbsp;World

The browser keeps the spacing exactly as written.

Displaying Fractions

Certain common fractions have ready-made entities.

&frac12;  → ½
&frac14;  → ¼
&frac34;  → ¾

You can also use numeric entities for custom fractions.

Entity for Emojis and Icons

Some emojis can be displayed using numeric entities if you know the Unicode value.

Example

&#128512; → 😀
&#128525; → 😍

Emojis using entities are helpful when you don’t want to load external icon libraries.

Full Example Showing Entities in a Paragraph

<p>
  &copy; 2025 MyWebsite. All rights reserved. 
  Use &lt;code&gt; tags to show HTML symbols like &lt;div&gt;. 
  Price starts from &dollar;199 &ndash; limited offer!
</p>

This example uses multiple entities together for layout, symbols and clarity.

Entity Reference Table (Common Entities)

Reserved characters

Character Entity Result
< &lt; <
> &gt; >
& &amp; &
" &quot; "
' &apos; '

Symbols

Symbol Entity Result
© &copy; ©
® &reg; ®
&trade;
° &deg; °

Math

Symbol Entity Result
× &times; ×
÷ &divide; ÷
&radic;
&infin;

Entities make your content more expressive.

When to Use Entities and When Not to Use Them

Use entities when:

  • the character is reserved

  • the symbol is not available on your keyboard

  • you need Unicode characters

  • you must prevent the browser from confusing HTML with text

  • you want clean and valid HTML

You don’t need entities when:

  • the character is normal text (letters, digits)

  • it doesn’t conflict with HTML rules

Using entities only when needed keeps your code clean.

Summary of HTML Entities

HTML entities help you display special characters safely and correctly. You learned how entities work, why reserved characters need them, how named and numeric entities differ and how to use symbols, arrows, math signs and emojis. Entities appear in almost every webpage and are essential for clean, valid, readable HTML. With the right entities, your pages can display text and symbols in a clear and consistent way.


Practice Questions

Q1. Write HTML to display <html> tags on a page using entities.

Q2. Show the text: Tom & Jerry correctly with the ampersand.

Q3. Display the copyright symbol © using entities.

Q4. Write a paragraph that includes quotes "Hello" using entities.

Q5. Show the registered trademark symbol ® in HTML.

Q6. Use numeric entity to display less than < symbol.

Q7. Display an email address with @ sign properly escaped.

Q8. Show the Euro sign € using a named entity.

Q9. Encode a sentence with multiple special characters: <, >, &.

Q10. Create a list showing different quotation marks using HTML entities.


Try a Short Quiz.

coding learning websites codepractice

No quizzes available.

Go Back Top