loom/reactions

This is the open-source Tailwindcss version of Looms’s beautiful Emoji Toolbar React component to react to anything.

Demo

View the demo here: https://reaction-demo.vercel.app

Installation

Requirements

• tailwindcss
• tailwindcss-animate

It’s pretty easy to install. I made it a standalone component that you can copy in your codebase.

1. Copy the toolbar component

2. Add keyframes and animation to your tailwind.config.ts

3. Import into your page

4. Change the emojis in the REACTIONS object in toolbar.tsx

Future Ideas

• onClick handler
• size prop to adjust the size of the toolbar
• dark mode support

Inspiration

• Thanks to the @loom design team for the awesome component.
• Thanks to @shadcn who gave me a new joy for UI design.

GitHub

View Github