emoji-mart

Emoji Mart is a web component that adds an emoji picker to any web application. You drop it into your page and users get a popup or panel showing the full range of standard emojis, organized into categories like people, nature, food, and flags. When a user clicks an emoji, a callback fires with the selection so your app can do something with it, such as inserting it into a message input.

The component works with React through a dedicated package, but it also runs in plain HTML pages without any framework. The emoji data, meaning the actual list of all emojis and their metadata, is shipped as a separate package. You can bundle that data directly into your app for instant loading, or fetch it on demand from a content delivery network to keep your initial page size smaller.

Configuration options are extensive. You can control which emoji categories appear, set the default skin tone, choose between light and dark themes, resize the buttons and emoji images, adjust where the search bar and preview appear, and limit which specific emojis are shown. The picker supports over 20 languages for its interface labels. It also supports custom emojis, meaning you can define your own image-based entries, including animated GIFs and SVGs, and group them into named categories alongside the standard ones.

Beyond the visual picker, the library offers a headless search function that lets you query emoji data programmatically without rendering any UI, and a utility to look up emoji metadata from a native emoji character.

The project is built by the Missive team, which makes a team email and chat product. It carries no explicit license statement in the README, though the repository description indicates it is open source.