Hover Button

Buttons 1

About

Hover Button with some nice animation

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

Code

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

Usage.tsx

import { HoverButton } from "@/components/ui/hover-button";
import { useState } from 'react'
export default function DemoOne() {
  const [count, setCount] = useState(0);
  return <><HoverButton onClick={() => setCount(count-1)}>
    Decrease
    </HoverButton>
    <span className='mx-4 text-3xl'>{count}</span>
    <HoverButton onClick={() => setCount(count+1)}>
    Increase
    </HoverButton></>;
}