HTML CSS JS

Special Characters (Like this one: 😀)

In this lesson I will talk to you about special characters. Sometimes you come up with a character that you want to put on your web page, like a copyright sign or a couple extra spaces (since you learned a while ago that the browser only recognizes 1 space.) Then you need to put in to your web page a special character. I will show you what I mean.

<p>Check &nbsp;&nbsp;&nbsp;&nbsp;This &nbsp;&nbsp;&nbsp;&nbsp;Out</p>

Check     This     Out


As you can see, now you can have several spaces at once by using &nbsp; non-breaking space and you can use it as few or as many times you need.


Let's try to do the copyright symbol now.

<p>Copyright &copy;</p>

Copyright ©

You use &copy; to display the copyright symbol. Before we go on, I have to say something pretty important to you. Don't use the & on your web page because otherwise the browser will think you are trying to display a special character and the browser might get all messed up. If you want to put the & sign on your web page, use the special character which is &amp;

HTML Character Codes

To we can refer to a special character with its Hex Code, HTML Code or its HTML Entity name. Below I wrote the copyright sign three different ways but they all rendered the same.

<p style="font-size: 2em;">&#xa9; &#169; &copy;</p>

© © ©

The good news is that you don't have to keep in mind the name of all the 65.000 entity because there's a great online tool to find the desired character:

Find HTML Character Codes

Special Character List

You can simply copy the characters below and paste them in your project:

  á à â ä ã å & < > " ' ‹ › « » ☞ $ ¢ £ ¥ € ₹ ₽ 元 © ® ☔ ☕ ⛹ ⛄ ☠ ☢ ♠ ♣ ♥ ♦ ▲ △ ◯ ◼ § ¶ ☎ ☐ ☑ ☒ ✔ ✘ ☺ ☻ ♪ ♫ ⚐ ✉ ✎ ☀ ✰ ★ ❝ ❞ ❤ † ➤ ➧ ← ↑ → ↓ ↖ ↗ ↘ ↙ ™ @ ✓ ℃ ℉ + × ÷ = ≠ ¼ ½ ¾ ⅓ ⅔ ! ? – — ⅀ Ω ℹ № ⚪ 🙂 😀 😊 😔 🌦 🌜 🌻 🍩 🍻 🍔 🎭 🏊 🏕 🐵 🐺 🐾 👀 👍 👎 👦 👪 👫 💀 💔 💩 💪 💰 💾 📁 📌 🔑 🔫 🚧 🛠 🛒

More characters to copy-paste.