magic-card

1import { useTheme } from "next-themes";
2 
3import { MagicCard } from "@/components/magicui/magic-card";
4 
5export function MagicCardDemo() {
6  const { theme } = useTheme();
7  return (
8    <div
9      className={
10        "flex h-[500px] w-full flex-col gap-4 lg:h-[250px] lg:flex-row"
11      }
12    >
13      <MagicCard
14        className="cursor-pointer flex-col items-center justify-center whitespace-nowrap text-4xl shadow-2xl"
15        gradientColor={theme === "dark" ? "#262626" : "#D9D9D955"}
16      >
17        Magic
18      </MagicCard>
19      <MagicCard
20        className="cursor-pointer flex-col items-center justify-center whitespace-nowrap text-4xl shadow-2xl"
21        gradientColor={theme === "dark" ? "#262626" : "#D9D9D955"}
22      >
23        Card
24      </MagicCard>
25    </div>
26  );
27}