Like Button

Buttons

About

A heart-shaped like button with a spring pop animation, ring pulse, radial particle burst, and a rolling odometer-style like count.

Built with React and Tailwind. Copy the prompt and paste it into Claude Code, Cursor or Lovable: your agent adds Like Button to your project and fits it to your theme.

Code

How Like Button is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

"use client";

import React from "react";
import LikeButton from "@/components/ui/like-button";

export default function LikeButtonDemo() {
  return (
    <div className="flex w-full flex-col items-center gap-5 py-10">
      <div className="flex flex-wrap items-center justify-center gap-4">
        <LikeButton count={1248} />
        <LikeButton count={99} defaultLiked />
        <LikeButton showCount={false} />
      </div>
      <p className="text-sm text-neutral-500 dark:text-neutral-400">
        Tap a heart — spring pop, ring pulse, particle burst and a rolling count
      </p>
    </div>
  );
}