HTML Entities

Last Updated : 02 Dec, 2024

In HTML, there are reserved characters, such as < (less than) and > (greater than), which are used to define tags like <p>. However, if you use these reserved characters within the content, browsers may misinterpret them as part of the tags.

HTML Entities were introduced to avoid this. Reserved characters should be replaced with their corresponding entities. For example:

< (less than) = <
> (greater than) = >

Syntax:

&entity_name; or & #entity_number;

Note: Entity names are case-sensitive.

Commonly Used HTML Entities

Some commonly used symbols with their Entity name and Entity numbers are listed below:

Symbols	Description	Entity name	Entity Number
	non-breaking space
<	less than	<	<
®	registered trademark	®	®
©	copyright	©	©
€	euro	€	€
¥	yen	¥	¥
£	pound	£	£
¢	cent	¢	¢
"	double quotation mark	"	"
&	ampersand	&	&
>	greater than	>	>
∂	PARTIAL DIFFERENTIAL	∂	∂
∃	THERE EXISTS	∃	∃
∅	EMPTY SETS	∅	∅
∇	NABLA	∇	∇
∈	ELEMENT OF	∈	∈
∉	NOT AN ELEMENT OF	∉	∉
+	PLUS SIGN	+	+
∏	N-ARY PRODUCT	∏	∏
∑	N-ARY SUMMATION	∑	∑
Α	Alpha	Α	Α
Β	Beta	Β	Β
Γ	Gamma	Γ	Γ
Δ	delta	Δ	Δ
Ε	Epsilon	Ε	Ε
Ζ	Zeta	Ζ	Ζ
♥	BLACK HEART SUIT = valentine	&hearts;	♥
♣	BLACK CLUB SUIT = shamrock	&clubs;	♣
♠	BLACK SPADE SUIT	&spades;	♠
↓	DOWNWARDS ARROW	↓	↓
→	RIGHTWARDS ARROW	→	→
↑	UPWARDS ARROW	↑	↑
←	LEFTWARDS ARROW	←	←
™	TRADEMARK	™	™
♦	BLACK DIAMOND SUIT	♦	♦
°	degree	°	°
∞	infinity	∞	∞
‰	per-mille	&permil;
⋅	dot operator	⋅	⋅
±	plus-minus	±	±
†	hermitian	&hercon;	⊹
-	minus sign	−	−
¬	-	¬	¬
%	percent sign	&percent;	%
f	Function	&fnof;	ƒ
∥	parallel	&parallel;	∥

Examples of HTML Entities

Example: In this example we displays various currency symbols using entity representations:

HTML

<!DOCTYPE html>
<html lang="en">
<head>
    <title>Currency Symbols</title>
</head>
<body>
    <h2>Currency Symbols Using HTML Entities</h2>
    <ul>
        <li>Dollar: &#36;</li>
        <li>Euro: &#8364;</li>
        <li>Pound: &#163;</li>
        <li>Yen: &#165;</li>
        <li>Rupee: &#8377;</li>
        <li>Won: &#8361;</li>
        <li>Franco: &#8355;</li>
        <li>Bitcoin: &#8383;</li>
    </ul>
</body>
</html>

Table of Content

Reserved Characters
Other Characters
Non-breaking Space
Combining Diacritical Marks
Best Practices for Using HTML Entities

Reserved Characters

These characters are either reserved for HTML or those which are not present in the basic keyboard & can't use them directly. Some of the reserved characters representations are given below:

Reserved Character	Entity Name
&	&
<	<
>	>
“	"

Other Characters

Some characters that aren’t available directly on our keyboard, therefore such an entity can be used to represent it by using their entity number. These keywords are directly not available to type, we need to specify their entity number. Here #x before the numbers represents the hexadecimal representation.

Character	Entities
≥	&GreaterEqual;
©	©
€	€
∃	∃

Example: Illustration of the use of special characters that are directly not available to type from the keyboard.

HTML

<!DOCTYPE html>
<html>

<head>
    <title>HTML Entities</title>
</head>

<body>
    <p>Showing euro &euro;</p>
    <p>Showing cent &cent;</p>
    <p>Showing Copyright &copy;</p>
    <p>Showing BLACK DIAMOND SUIT &diams;</p>
    <p>Showing TRADEMARK &trade;</p>
</body>

</html>

Non-breaking Space

It is used to provide space that will not break into a new line. This HTML entity is represented by   that will separate the 2 words & will stick together without breaking it into a new line. We can also use the non-breaking space for preventing the browsers from truncating spaces in HTML pages. The non-breaking hyphen (‑) is used to define a hyphen character (‑) that does not break into a new line.

Example

12:00 PM
256 km/h

If we use to write 10 spaces in our text, then the browser will remove 9 of them. In order to add real spaces in our text, we can use the character entity.

Combining Diacritical Marks

A diacritical mark is a symbol added to a letter. Marks like the grave accent ( ̀) and acute accent ( ́) are examples of diacritical marks. They can be placed above, below, or inside a letter, or even between two letters. These marks are combined with letters to create new characters not found in the basic character set. Here are some common diacritical marks.

Here are some examples:

Mark	Character	Construct (HTML Code)	Final Result
`̀`	a	`à`	à
`́`	a	`á`	á
`̂`	a	`â`	â
`̃`	a	`ã`	ã
`̀`	O	`Ò`	Ò
`́`	O	`Ó`	Ó
`̂`	O	`Ô`	Ô
`̃`	O	`Õ`	Õ

Best Practices for Using HTML Entities

Use Named Entities When Possible: Named entities (< instead of <) are easier to remember and make your code more readable.
Verify Entity Codes: Always check your entity codes to ensure they display correctly across all browsers and platforms.
Use Entities for Readability and Compliance: Besides reserved characters, use entities to improve the readability of your code and to comply with HTML standards, especially when dealing with characters that may not be directly supported by your page’s charset.

Supported Browsers

HTML Charsets

Shahnawaz_Ali

Improve

Article Tags :

HTML Entities

Commonly Used HTML Entities

Symbols

Description

Entity name

Entity Number

Examples of HTML Entities

Reserved Characters

Reserved Character

Entity Name

Other Characters

Character

Entities

Non-breaking Space

Combining Diacritical Marks

Best Practices for Using HTML Entities

Supported Browsers

Similar Reads

HTML Basics

HTML Tags

HTML Attributes

HTML Graphics

HTML APIs

HTML DOM

HTML Audio/Video

HTML 5

HTML 5 MathML

HTML Course

Thank You!

What kind of Experience do you want to share?