Docs
Profile Card
Profile Card
Displays a beautiful Profile Card.
November 15, 2024
kuo zhang
Commitment to Excellence
We pursue excellence in everything we do while staying true to our founding principles. Success is measured not just by technical achievement but by the positive impact on our users.
Installation
Install the following dependencies:
npm install framer-motionCopy and paste the cn util code into your project.
import { ClassValue, clsx } from "clsx"
import { twMerge } from "tailwind-merge"
export function cn(...inputs: ClassValue[]) {
return twMerge(clsx(inputs))
}
Copy and paste the Profile Card code into your project.
Usage
export default function ProfileCardDemo(){
return (
<ProfileCard
avatarUrl1="/images/avatars/buoooou.png"
avatarUrl2="/images/avatars/buoooou.png"
name="kuo zhang"
email="[email protected]"
date="November 15, 2024"
title="Commitment to Excellence"
content="We pursue excellence in everything we do while staying true to our founding principles. Success is measured not just by technical achievement but by the positive impact on our users."
/>
)
}