Empty Background

An empty state placeholder with a muted background surface, icon, title, description and refresh action for pages or panels with no content.

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

import EmptyBackground from "@/components/ui/empty-background";

export default function Default() {
  return (
    <div className="flex min-h-screen w-full items-center justify-center bg-background p-6">
      <div className="h-80 w-full max-w-md">
        <EmptyBackground />
      </div>
    </div>
  );
}