Planes

Components

Controls

Reaction Arc

ProUnlock all 54 Pro — $99 once

A Like button that reveals a reaction picker on hover. Your pick flies back along a curved path and becomes the active reaction.

All components

Installation

ProRequires a Planes Pro license.
npx shadcn add @useplanes/reaction-arc

Unlock with Planes Pro

$99 once · 54 Pro components · lifetime updates.

I have a licenseGet Pro
import { ThumbsUp, Heart, Lightbulb } from "lucide-react"

<ReactionArc
  size={44}
  reactions={[
    { label: "Like", Icon: ThumbsUp, color: "#2f7fe0" },
    { label: "Love", Icon: Heart, color: "#d94e3c" },
    { label: "Insightful", Icon: Lightbulb, color: "#e09a2f" },
  ]}
/>

Use cases

  • Social engagement

    Facebook-style Like button where the picked reaction arcs back onto the button.

  • Chat reactions

    Slack/iMessage-style emoji reactions that visibly travel from picker to trigger.

  • Add-to-collection

    Any item-flies-to-target pattern — save, bookmark, or add-to-cart feedback.

  • Gamified feedback

    Points or rewards that lob into a score badge with a spring-pop landing.