README

Twitter Emoji (Twemoji) 

A simple library that provides standard Unicode emoji support across all platforms.

Twemoji v14.0 adheres to the Unicode 14.0 spec and supports the Emoji 14.0 spec. _We do not support custom emoji._

The Twemoji library offers support for all Unicode-defined emoji which are recommended for general interchange (RGI).

 Usage

 CDN Support

The folks over at MaxCDN have graciously provided CDN support.

MaxCDN is shut down right now, so in the meanwhile use a different CDN or download the assets. (See Maxcdn has shut down, cdn not working anymore. · Issue 580 · twitter/twemoji).

Use the following in the  tag of your HTML document(s):

html



This guarantees that you will always use the latest version of the library.

If, instead, you'd like to include the latest version explicitly, you can add the following tag:
html



 Download

If instead you want to download a specific version, please look at the gh-pages branch, where you will find the built assets for both our latest and older versions.

 API

Following are all the methods exposed in the twemoji namespace.

 twemoji.parse( ... ) V1

This is the main parsing utility and has 3 overloads per parsing type.

Although there are two kinds of parsing supported by this utility, we recommend you use DOM parsing, explained below. Each type of parsing accepts a callback to generate an image source or an options object with parsing info.

The second kind of parsing is string parsing, explained in the legacy documentation here. This is unrecommended because this method does not sanitize the string or otherwise prevent malicious code from being executed; such sanitization is out of scope.

 DOM parsing

If the first argument to twemoji.parse is an HTMLElement, generated image tags will replace emoji that are inside text nodes only without compromising surrounding nodes or listeners, and completely avoiding the usage of innerHTML.

If security is a major concern, this parsing can be considered the safest option but with a slight performance penalty due to DOM operations that are inevitably costly.

js
var div = document.createElement('div');
div.textContent = 'I \u2764\uFE0F emoji!';
document.body.appendChild(div);

twemoji.parse(document.body);

var img = div.querySelector('img');

// note the div is preserved
img.parentNode === div; // true

img.src;        // https://twemoji.maxcdn.com/v/latest/72x72/2764.png
img.alt;        // \u2764\uFE0F
img.className;  // emoji
img.draggable;  // false



All other overloads described for string are available in exactly the same way for DOM parsing.

 Object as parameter

Here's the list of properties accepted by the optional object that can be passed to the parse function.

js
  {
    callback: Function,   // default the common replacer
    attributes: Function, // default returns {}
    base: string,         // default MaxCDN
    ext: string,          // default ".png"
    className: string,    // default "emoji"
    size: string|number,