Button 49

PreviousNext

Button with stitched border design using layered shadow effects

Docs
shadcn-studiocomponent

Preview

Loading preview…
registry/new-york/components/button/button-49.tsx
import { ArrowUpRightIcon } from 'lucide-react'

import { CraftButton, CraftButtonLabel, CraftButtonIcon } from '@/registry/new-york/ui/craft-button'

const CraftButtonDemo = () => {
  return (
    <CraftButton>
      <CraftButtonLabel>Click me</CraftButtonLabel>
      <CraftButtonIcon>
        <ArrowUpRightIcon className='size-3 stroke-2 transition-transform duration-500 group-hover:rotate-45' />
      </CraftButtonIcon>
    </CraftButton>
  )
}

export default CraftButtonDemo

Installation

npx shadcn@latest add @shadcn-studio/button-49

Usage

import { Button49 } from "@/components/button-49"
<Button49 />