Leather Button

Buttons 22

About

A premium leather-textured button component with authentic stitching effects, smooth hover animations.

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

Code

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

Usage.tsx

"use client"

import LeatherButton from "@/components/ui/leather-button"

export default function Component() {
  return (
    <div className="min-h-screen w-full bg-background flex items-center justify-center p-8">
      <div className="space-y-8 text-center">
        <div className="space-y-6">
          <div>
            <LeatherButton onClick={() => alert("Clicked!")}>Click Me</LeatherButton>
          </div>

          <div>
            <LeatherButton disabled>Disabled Button</LeatherButton>
          </div>
        </div>
      </div>
    </div>
  )
}