Emoji Spree Choice Chips

Renders emoji-based buttons for multi-select with animated particles. Buttons animate when clicked and show a floating emoji effect. Displays selected items in a pill at the bottom. Use for interactive interest selection or playful forms.

byWatermelon Corp from Watermelon

Installation

terminal

pnpm dlx layro-cli add @watermeloncorp/emoji-spree-choice-chips

npx layro-cli add @watermeloncorp/emoji-spree-choice-chips

npx layro-cli add @watermeloncorp/emoji-spree-choice-chips

bunx layro-cli add @watermeloncorp/emoji-spree-choice-chips

New project? Start with init. Writes third-party code and installs packages with scripts off.

Code

Demo

'use client';

import React, { useState } from 'react';
import { motion, AnimatePresence } from 'motion/react';

export interface InterestItem {
  id: string;
  label: string;
  emoji: string;
}

interface Particle {
  id: string;
  emoji: string;