Morphing Card

Card that morphs between different states.

Preview

Installation & Usage

tsx
import { MorphingCard } from "@/components/ui/morphing-card"

export function MorphingCardDemo() {
  return (
    <div className="h-[400px] flex items-center justify-center">
      <MorphingCard />
    </div>
  )
}

Component Details

FrameworkReact / Next.js
StylingTailwind CSS
AnimationFramer Motion
Dependencies
framer-motion