Emoji Picker

Max Steitle

Open in Framer X


This is a full-blown emoji picker. Choose either Light or Dark mode. If you’re looking into learning how to make more advanced code components, this is a great place to start.

Learn how to…

  • Implement search
  • Map a JSON file
  • Use CSS in components
  • Lift state (React term)
  • Custom hooks

Look at the code


const data = Data({ text: '' });

export const setEmoji: Override = () => {
    return {
        onClick(emoji) {
            data.text = emoji.toString();

export const getEmoji: Override = () => {
    return {
        text: data.text
Opening Package in Framer X...

Don’t have Framer X yet?Start your Free Trial

By using our website, you agree to the use of cookies as described in our  Privacy Policy —
I Agree