# Manually inserting font with HTML

**URL:** https://meta.discourse.org/t/manually-inserting-font-with-html/129737
**Category:** Support
**Created:** [September 28, 2019, 2:40pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737 "2019-09-28T14:40:44Z")
**Posts on this page:** 8
**Page:** 1

<div class="post-metadata">

### Author: ![verilog15](https://avatars.discourse-cdn.com/v4/letter/v/9f8e36/32.png) [@verilog15](https://meta.discourse.org/u/verilog15)
#### Post date: [September 28, 2019, 2:40pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/1 "2019-09-28T14:40:45Z")

</div>

Hello 🙂  
I’m trying to add the following two symbols:❤ and ✅ by using HTML.  
As I understand they are fonts from Font Awesome so I tried to insert:

```
<i class="fa fa-heart-o"></i>

```

But it does not insert the font:

![image](https://global.discourse-cdn.com/meta/original/3X/1/d/1d1402dc5c8dcff58409616d11c0304037489689.png)

It adds something of size 0x0. What is the proper way to add the font?

---

<div class="post-metadata">

### Author: ![zogstrip](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/zogstrip/32/512781_2.png) [@zogstrip](https://meta.discourse.org/u/zogstrip)
#### Post date: [September 28, 2019, 3:49pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/2 "2019-09-28T15:49:50Z")

</div>

Have you tried adding some custom CSS to force a size?

---

<div class="post-metadata">

### Author: ![codinghorror](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/codinghorror/32/110067_2.png) [@codinghorror](https://meta.discourse.org/u/codinghorror)
#### Post date: [September 28, 2019, 7:10pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/3 "2019-09-28T19:10:05Z")

</div>

Why not use the Unicode emoji instead?

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [September 28, 2019, 7:58pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/4 "2019-09-28T19:58:50Z")

</div>

That is the old format. We have switched to SVG icons for FontAwesome (since November 2018), we now use svg syntax instead of the font-icon `i` elements.

---

<div class="post-metadata">

### Author: ![verilog15](https://avatars.discourse-cdn.com/v4/letter/v/9f8e36/32.png) [@verilog15](https://meta.discourse.org/u/verilog15)
#### Post date: [September 29, 2019, 1:42pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/5 "2019-09-29T13:42:36Z")

</div>

> [@codinghorror](#):
>
> Why not use the Unicode emoji instead?

I have managed to make it work with the Unicode emojis but I guess it is not the solution because of the following two reasons:

1. Consistent to the other emojis. For example, if I’ll decide to change the emoji type from Windows 10 to apple than I’ll have to change also in the plugin.
2. Not sure if old browsers support those type of fonts/Unicode.

But I guess it is better than using the SVG if speaking of efficiency.

> [@pmusaraj](#):
>
> That is the old format. We have switched to SVG icons for FontAwesome (since November 2018), we now use svg syntax instead of the font-icon `i` elements.

Do you mind to show a small example of how to use one maybe?

---

<div class="post-metadata">

### Author: ![pmusaraj](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pmusaraj/32/119489_2.png) [@pmusaraj](https://meta.discourse.org/u/pmusaraj)
#### Post date: [September 29, 2019, 3:03pm UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/6 "2019-09-29T15:03:44Z")

</div>

If you are adding these icons to a plugin, there are tools in core to use them in both Ruby and Ember. See [Introducing Font Awesome 5 and SVG icons](https://meta.discourse.org/t/introducing-font-awesome-5-and-svg-icons/101643) for a start.

---

<div class="post-metadata">

### Author: ![system](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/system/32/443519_2.png) [@system](https://meta.discourse.org/u/system)
#### Post date: [May 24, 2023, 7:29am UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/7 "2023-05-24T07:29:15Z")

</div>



---

<div class="post-metadata">

### Author: ![Canapin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/canapin/32/119591_2.png) [@Canapin](https://meta.discourse.org/u/Canapin)
#### Post date: [May 24, 2023, 10:14am UTC](https://meta.discourse.org/t/manually-inserting-font-with-html/129737/8 "2023-05-24T10:14:02Z")

</div>


