Banner 2

Component 5

About

Fullwidth banner with icon, announcement text and button.

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

Code

How Banner 2 is used: the demo's code. The component's own source comes with a free account.

Usage.tsx

import { Banner2 } from "@/components/blocks/banner2";

const demoData = {
  title: "Version 2.0 is now available!",
  description: "Read the full release notes",
  linkText: "here",
  linkUrl: "https://shadcnblocks.com",
  defaultVisible: true,
};

function Banner2Demo() {
  return <Banner2 {...demoData} />;
}

export { Banner2Demo };