Banner 1

Buttons 16

About

Classic announcement banner that runs across the top of page.

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

Code

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

Usage.tsx

import { Banner1 } from "@/components/blocks/banner";

const demoData = {
  title: "Version 2.0 is now available!",
  description: "Check out all the",
  linkText: "new features",
  linkUrl: "https://shadcnblocks.com",
  defaultVisible: true,
};

function Banner1Demo() {
  return <Banner1 {...demoData} />;
}

export { Banner1Demo };