Isaiah

Profile Card

Buttons 399

About

This is a high-fidelity Animated Profile Card component designed for user discovery or social interactions. It includes layered blur effects, animated reveal of bio/stats, motion-enhanced name rendering (letter-by-letter), and an interactive follow button. It adapts to theme and motion preferences, making it production-ready for profile previews in social apps, team dashboards, or creator platforms. Perfect for social networks, SaaS teams, influencer marketplaces, or any UI needing rich identity previews with motion-driven engagement.

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

Code

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

Usage.tsx

"use client"

import { ProfileCard } from "@/components/ui/profile-card"

export default function Page() {
  return (
    <div className="min-h-screen p-8 bg-background flex items-center justify-center">
      <ProfileCard />
    </div>
  )
}

Dependencies