Components
Loading preview...
Animated Promo Card A visually engaging card that applies a 3D tilt effect on hover. It's designed to showcase promotional content with a background image, title, subtitle, and a call-to-action button.
@ravikatiyar
npx shadcn@latest add https://21st.dev/r/ravikatiyar162/promo-cardimport { AnimatedPromoCard } from "@/components/ui/promo-card"; // Adjust the import path
export default function AnimatedPromoCardDemo() {
return (
<div className="w-full h-full flex items-center justify-center bg-background p-4">
<AnimatedPromoCard
imageSrc="https://images.unsplash.com/photo-1517604931442-7e0c8ed2963c?w=900&auto=format&fit=crop&q=60&ixlib=rb-4.1.0&ixid=M3wxMjA3fDB8MHxzZWFyY2h8MTB8fG1vdmllfGVufDB8fDB8fHww?q=80&w=2070&auto=format&fit=crop" // Placeholder image
title="Severance"
subtitle="Season 2 streaming now"
buttonText="Watch Now"
href="#"
/>
</div>
);
}