Empty Card

An empty-state placeholder with an icon, title, description and action buttons for showing "no data yet" screens like empty project lists.

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

import EmptyCard from "@/components/ui/empty-card";

export default function EmptyCardDemo() {
  return (
    <div className="flex w-full items-center justify-center p-8">
      <EmptyCard />
    </div>
  );
}