Emoji Mart: Free Emoji Picker for Web Apps

When I was putting together a small chat section for one of my side projects, i realised the input field looked really bare. Like something was clearly missing even though it technically worked fine. You know that feeling — Telegram has a smiley button, Slack has one, Discord has one. Without it the whole thing just looks unfinished, no matter how good the rest of the app is.

Emoji Mart solves exactly this. It's a free, customizable emoji picker that works in any web app — React, Vue, plain HTML, whatever your agent set up. The live demo is at missiveapp.com/open/emoji-mart and it look exactly like the picker you'd see in a professional chat product. Search works, categories work, dark mode switches automatically, skin tone selector is there too. Over 9000 GitHub stars and used by teams building real products.

The picker works in two modes depending on how your project is built. If your agent created a React app, there's a dedicated React package that drops in as a single component. If it's a simpler HTML setup — or if you just want to test it quickly — there's a browser version that loads via a CDN link, no npm or installation required at all. Supports 22+ languages including Russian out of the box.

1How your agent adds Emoji Mart

npm install --save emoji-mart @emoji-mart/data @emoji-mart/react

<script src="https://cdn.jsdelivr.net/npm/emoji-mart@latest/dist/browser.js"></script>
<script>
  const picker = new EmojiMart.Picker({ onEmojiSelect: console.log })
  document.body.appendChild(picker)
</script>

2What to tell your agent

Add an emoji picker to the chat input using emoji-mart (@emoji-mart/react). When the user clicks the emoji icon next to the input field, show the picker. When they select an emoji, insert it into the input field at the cursor position.

Add an emoji picker to the message input. Load emoji-mart from https://cdn.jsdelivr.net/npm/emoji-mart@latest/dist/browser.js. When the user clicks the smiley button, show the picker. Insert the selected emoji into the text field.