holographic-card-demo

1import HolographicCard from "@/registry/eldoraui/holographic-card"
2 
3export default function HolographicCardDemo2() {
4  return (
5    <div className="flex min-h-screen flex-col items-center justify-center gap-12 overflow-hidden px-6 py-12">
6      <div className="pointer-events-none absolute inset-0 z-[-1]" />
7 
8      <HolographicCard
9        id="namer-ui-holographic-card-2"
10        width={316}
11        height={448}
12        imageSrc="https://github.com/Northstrix/my-portfolio/blob/main/public/playground-card-image.webp?raw=true"
13        topText="洪秀全"
14        bottomText="洪秀全"
15        topTextLetterSpacing="0.375rem"
16        bottomTextLetterSpacing="0.375rem"
17        maxImageWidthPct={0.64}
18        topTextColor="#8E5BEE"
19        topTextHoverColor="#E95FF6"
20        bottomTextColor="#8E5BEE"
21        bottomTextHoverColor="#E95FF6"
22        borderWidth={2}
23        borderColor="#8E5BEE"
24        backgroundColor="#fff"
25        patternSize={12.06}
26        patternDotSize={1.75}
27        patternColor="rgba(142, 91, 238, 0.1)"
28      />
29    </div>
30  )
31}