javascripttwemoji

How to resize twemoji emojis?

I'm using twemoji to style emojis on a page:

$(document).ready(function () {  
  document.body = twemoji.parse(document.body)
 });

It works fine, however the default emojis turn out to be 72x72:

<img draggable="false" class="emoji" alt="😀" src="https://twemoji.maxcdn.com/2/72x72/1f600.png">

I'd like twemoji to render 16x16 png or svg icons instead.

The docs does not explicitly say how to change the icon size, so I tried things like:

$(document).ready(function () {  
  document.body = twemoji.parse(document.body, 
   {size: 16}
    )
 });

But none worked. How can I fix this?

Solution

  • You can set the default size before running the parse() method:

    $(document).ready(function () {  
  // Set the size of the rendered Emojis
  // This can be set to 16x16, 36x36, or 72x72
  twemoji.size = '36x36';

  document.body = twemoji.parse(document.body);
});

    Credit to this page for the tip (and to this simple google search for finding it!).