Components
Loading preview...
Modern Hero
@shadcnblockscom
npx shadcn@latest add https://21st.dev/r/shadcnblockscom/modern-heroimport { Hero7 } from "@/components/blocks/modern-hero"
const demoData = {
heading: "A Collection of Components Built With Shadcn & Tailwind",
description:
"Finely crafted components built with React, Tailwind and Shadcn UI. Developers can copy and paste these blocks directly into their project.",
button: {
text: "Discover all components",
url: "https://www.shadcnblocks.com",
},
reviews: {
count: 200,
avatars: [
{
src: "https://www.shadcnblocks.com/images/block/avatar-1.webp",
alt: "Avatar 1",
},
{
src: "https://www.shadcnblocks.com/images/block/avatar-2.webp",
alt: "Avatar 2",
},
{
src: "https://www.shadcnblocks.com/images/block/avatar-3.webp",
alt: "Avatar 3",
},
{
src: "https://www.shadcnblocks.com/images/block/avatar-4.webp",
alt: "Avatar 4",
},
{
src: "https://www.shadcnblocks.com/images/block/avatar-5.webp",
alt: "Avatar 5",
},
],
},
};
function Hero7Demo() {
return <Hero7 {...demoData} />;
}
export { Hero7Demo };