An emoji is a glyph used to represent an emotional state

Emoji Set

An emoji set contains all Unicode 14.0 Emoji Characters

Emojis serve a very similar function to text in a page. In Fomantic emojis receive a special tag <em> which allow for an abbreviated markup when sitting along-side text.
Because of the complexity and possible interference with existing fomantic classnames, emoji names have to be provided via the data-emoji attribute instead of usual classnaming.
By default all emoji images are linked to a CDN and are not part of Fomantic itself. If needed, you might download your personal icon set from the respective websites respecting their individual licenses, host it locally and change the @emojiPath in emoji.variables of the theme you are using.
If you use Fomantic in a commercial or business project or want to host the emoji assets locally and also want to use the alternative joypixels set, you may require an additional license for your project depending of the usage.
You will find joypixels licenses at
You can reduce your custom generated CSS by adjusting the @emoji-map variable in your themes emoji.variables file to only the emojis you need.


You can provide the emoji shortname with or without colons

I Fomantic-UI I Fomantic-UI



An emoji can show that it is disabled


An emoji can be used as a simple loader



An emoji can vary in size



If no specific size class is given, all emojis are automatically sized according to the current element font-size

Within a header
Within a button

Within a label

Within a text


An emoji can be formatted as a link

Dimmer Message
Dimmer sub-header