@emoji-mart/react

Emoji Picker

The basic emoji picker component allows users to select emojis. The selected emoji is logged to the console in this example.

import { Picker } from '@emoji-mart/react';

function App() {
  return <Picker onEmojiSelect={console.log} />;
}

Customizable Emoji Picker

The emoji picker can be customized with different themes, such as 'dark' mode, to better fit the application's design.

import { Picker } from '@emoji-mart/react';

function App() {
  return <Picker theme="dark" onEmojiSelect={console.log} />;
}

Search Functionality

The emoji picker includes a search bar to allow users to quickly find specific emojis.

import { Picker } from '@emoji-mart/react';

function App() {
  return <Picker onEmojiSelect={console.log} showSearch={true} />;
}

Skin Tone Selector

The emoji picker supports selecting different skin tones for applicable emojis.

import { Picker } from '@emoji-mart/react';

function App() {
  return <Picker onEmojiSelect={console.log} showSkinTones={true} />;
}