# Harmonizing Discourse icons and emojis

**URL:** https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424
**Category:** UX
**Tags:** planned
**Created:** [10월 13, 2018, 9:31오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424 "2018-10-13T09:31:16Z")
**Posts on this page:** 12
**Page:** 1

<div class="post-metadata">

### Author: ![hellekin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hellekin/32/51636_2.png) [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [10월 13, 2018, 9:31오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/1 "2018-10-13T09:31:17Z")

</div>

Continuing the discussion from [Actions and markup: Icons vs Tags](https://meta.discourse.org/t/actions-and-markup-icons-vs-tags/85741):

From time to time I’m writing documentation for new users and end up typing `:` to trigger the emoji completion and find the `:bookmark:` icon, or the `:pin:` icon, or the `:gear:` icon to show what to look for to accomplish a certain action. As exemplified with these three: 🔖, :pin:, and ⚙, the iconography seems not to be designed for such a use-case. I end up using longer sentence to avoid adding to the confusion of the (usually impressed) users who freshly dived into Discourse.

It seems there’s already a (fastidious) way to [Change icons globally](https://meta.discourse.org/t/change-icons-globally-using-the-apis/87751), but I’m wondering whether there are other options to use Discourse UI icons in posts somehow.

---

<div class="post-metadata">

### Author: ![pfaffman](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/pfaffman/32/120154_2.png) [@pfaffman](https://meta.discourse.org/u/pfaffman)
#### Post date: [10월 13, 2018, 9:50오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/2 "2018-10-13T09:50:54Z")

</div>

I agree. I often end up taking a screen shot of the icons and paste them in.

---

<div class="post-metadata">

### Author: ![sam](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/sam/32/102149_2.png) [@sam](https://meta.discourse.org/u/sam)
#### Post date: [10월 13, 2018, 10:50오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/3 "2018-10-13T10:50:59Z")

</div>

I vaguely recall many years ago I had a plugin that did this, it is broken by now, I recommend holding off on this idea till we are done with our fontawesome upgrade, cause once that is done the palate of optional icons becomes enormous making it far more appealing to re-build that old trivial plugin 😊

---

<div class="post-metadata">

### Author: ![hellekin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hellekin/32/51636_2.png) [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [10월 16, 2018, 7:00오후 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/4 "2018-10-16T19:00:18Z")

</div>

Today I discovered [Fork Awesome, a fork of the iconic font and CSS toolkit](https://forkawesome.github.io/Fork-Awesome/), a fork of Font-Awesome that

- does not require JavaScript
- accepts new custom icons
- is [GPL friendly](https://forkawesome.github.io/Fork-Awesome/license/).

> ## Switching from Font Awesome 4.7?
> 
> If you were using Font Awesome 4.7, you should be able to just switch to Fork Awesome 1.1 and get all the benefits from it. If you were using npm or composer packages, replace the ones you were using by this Fork Awesome ones. Or if you downloaded a static copy of Font Awesome, download the latest version of Fork Awesome and replace CSS and font files in your project and you should be good to go.
> 
> We paid special attention not to change unicode codepoints for the existing icons, nor changed the CSS class names or icon names from Font Awesome 4.7. Though we added a few more icons and made the process of contributing to this project much easier. Though, if you see a mistake, please don’t hesitate to [file a bug](https://forkawesome.github.io/Fork-Awesome/community/#reporting-bugs).

P.S.: and they could use a Discourse 😉

---

<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: [10월 16, 2018, 11:37오후 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/5 "2018-10-16T23:37:44Z")

</div>

Good point @erlend_sh maybe we can contact them and suggest they use Discourse 😉

@hellekin in this upcoming release we are planning to move to all SVG icons for flexibility and away from a specific icon font, it’s a project @awesomerobot is heading up.

---

<div class="post-metadata">

### Author: ![erlend\_sh](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/erlend_sh/32/119475_2.png) [@erlend\_sh](https://meta.discourse.org/u/erlend_sh)
#### Post date: [10월 17, 2018, 7:11오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/6 "2018-10-17T07:11:44Z")

</div>

They’re pretty low volume so they seem to have what they need with a [SO + GitHub setup](https://forkawesome.github.io/Fork-Awesome/community/).

---

<div class="post-metadata">

### Author: ![hellekin](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/hellekin/32/51636_2.png) [@hellekin](https://meta.discourse.org/u/hellekin)
#### Post date: [11월 2, 2021, 11:27오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/7 "2021-11-02T11:27:35Z")

</div>

@awesomerobot 이 기능에 대한 사용법 문서 링크를 알려주실 수 있을까요?

---

<div class="post-metadata">

### Author: ![tshenry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tshenry/32/119495_2.png) [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [11월 3, 2021, 1:40오전 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/8 "2021-11-03T01:40:48Z")

</div>

아마도 이 컴포넌트를 찾고 계실 것 같습니다: [GitHub - discourse/discourse-icon · GitHub](https://github.com/discourse/discourse-icon). 현재 메타에 이에 대한 별도의 주제는 없지만, 게시물에서는 다음과 같이 사용할 수 있습니다:

```plaintext
[wrap=icon id="bookmark"][/wrap]

```

관심 있으시면 참고하실 수 있는 다른 아이콘 리소스:

- [Introducing Font Awesome 5 and SVG icons](https://meta.discourse.org/t/introducing-font-awesome-5-and-svg-icons/101643)
- [Replace Discourse's default SVG icons with custom icons in a theme](https://meta.discourse.org/t/replace-discourses-default-svg-icons-with-custom-icons-in-a-theme/115736)
- [Alternative icons](https://meta.discourse.org/t/alternative-icons/206693)

---

<div class="post-metadata">

### Author: ![Jonathan5](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jonathan5/32/197134_2.png) [@Jonathan5](https://meta.discourse.org/u/Jonathan5)
#### Post date: [11월 30, 2021, 10:11오후 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/11 "2021-11-30T22:11:13Z")

</div>

정말 좋습니다. 이 주제에 해당하는 것 같습니다: [Discourse Icon](https://meta.discourse.org/t/discourse-icon-component/143374)

---

<div class="post-metadata">

### Author: ![Jonathan5](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jonathan5/32/197134_2.png) [@Jonathan5](https://meta.discourse.org/u/Jonathan5)
#### Post date: [11월 30, 2021, 10:53오후 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/12 "2021-11-30T22:53:24Z")

</div>

안타깝게도 `\faq` 페이지에서는 작동하지 않습니다(아이콘 대신 아무것도 표시되지 않음).

또한, FAQ 게시글에 [wrap] 아이콘을 추가한 후 페이지를 열면 **일반** 게시글의 아이콘이 표시되지 않습니다. 그런 다음 FAQ 게시글에서 [wrap] 아이콘을 제거하면 일반 게시글에 아이콘이 마법처럼 다시 나타납니다.

---

<div class="post-metadata">

### Author: ![tshenry](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/tshenry/32/119495_2.png) [@tshenry](https://meta.discourse.org/u/tshenry)
#### Post date: [11월 30, 2021, 11:51오후 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/13 "2021-11-30T23:51:39Z")

</div>

> [@Jonathan5](#):
>
> 이것이 해당 주제인 것 같습니다: [Discourse-icon component](https://meta.discourse.org/t/discourse-icon-component/143374)

맞습니다! 찾아내주셔서 감사합니다.

> [@Jonathan5](#):
>
> 불행히도 `\faq` 페이지에서는 작동하지 않습니다(아이콘 대신 아무것도 표시되지 않음).

FAQ 페이지는 기술적으로 게시물의 콘텐츠에 기반을 두고 있지만, 일종의 특수한 설정이므로 해당 컨텍스트에서 작동하지 않는 것은 놀라운 일이 아닙니다.

> [@Jonathan5](#):
>
> FAQ 게시물에 [wrap] 아이콘을 추가하고 페이지를 표시하면 **일반** 게시물에서 아이콘이 표시되지 않습니다.

음. 저는 그 동작을 재현할 수 없습니다.

---

<div class="post-metadata">

### Author: ![Jonathan5](https://sea3.discourse-cdn.com/meta/user_avatar/meta.discourse.org/jonathan5/32/197134_2.png) [@Jonathan5](https://meta.discourse.org/u/Jonathan5)
#### Post date: [11월 30, 2021, 11:58오후 UTC](https://meta.discourse.org/t/harmonizing-discourse-icons-and-emojis/99424/14 "2021-11-30T23:58:37Z")

</div>

> [@tshenry](#):
>
> 음. 그 동작을 재현할 수 없네요.

FAQ 페이지 때문은 아니었을 수도 있어요(우연일 수도 있고요). 하지만 제 눈앞에서 이모지가 사라졌다가 다시 나타나는 현상은 분명 두 번이나 일어났습니다.
