Open-source emoji set · Animated

Animated Noto Emoji

Google’s Noto emoji with motion, the ones Google animates across its products. Point at any emoji to play it. CC BY 4.0, so credit is required.

609 emoji WebP · animated CC BY 4.0 · free for commercial use Credit required

Made by

Google, version latest. Not our drawings: every file below loads from the maker's own published files.

Licence

CC BY 4.0. Credit the maker and link the licence wherever the emoji appear.

Credit line to paste

Animated Noto Emoji © Google, licensed CC BY 4.0

Coverage

609 of the 1,923 emoji in Unicode 18.0, one tile each. Not drawn here: 327 People & Body, 266 Flags, 203 Objects, 188 Symbols, 147 Travel & Places, 66 Animals & Nature, 64 Food & Drink, 42 Activities, 11 Smileys & Emotion. Animated WebP files from Google’s fonts CDN. Each tile shows the Noto still and plays when you point at it. Skin-tone variants are in the source and left out of this grid.

Smileys & Emotion 161 of 172

People & Body 63 of 390

Animals & Nature 95 of 161

Food & Drink 68 of 132

Travel & Places 74 of 221

Activities 43 of 85

Objects 65 of 268

Symbols 36 of 224

Flags 4 of 270

Using these emoji on a page

Picking a set means every visitor sees the same face, whatever device they are on; a typed emoji is drawn by the visitor's own system font and looks different on every platform. Use the image with its name as alt, sized to the text around it:

<img src="https://cdn.jsdelivr.net/gh/googlefonts/noto-emoji@e20cbc2bbec1926686be9f9bee7d1d2cfa1fea0e/2D/svg/emoji_u1f600.svg"
     alt="grinning face" width="20" height="20"
     style="height:1.2em;width:auto;vertical-align:-0.2em">

The name is the Unicode name, which is also what a screen reader says for the typed character, so the image and the text version read the same. These are animated WebP files, a few hundred kilobytes to a couple of megabytes each, so this page shows the still image and loads the animation only when you point at an emoji. On your own page, do the same: show the still and swap in the animation on hover or when it scrolls into view. For the whole set, with every skin tone, get it from the maker.

Comparing sets, or checking which licence fits a client project? All the open emoji sets side by side, with what each licence asks.

Made your own emoji pack?

Submit yours

Receive a link back from us (DR 73 site).

Must link to csscreme.com to be eligible.

The other open emoji sets