Block

Gradient Hero

A hero section with gradient background and centered content

Installation

npx shadcn add @mylo-ui/hero-gradient

Introducing v2.0

Copy-paste ready components built with shadcn/ui and Tailwind CSS. Create stunning landing pages in minutes, not hours.

Open Source

TypeScript

150+ Blocks

import { HeroGradient } from "@/components/blocks/hero-gradient"

export default function Page() {
  return <HeroGradient />
}

lucide-react

button

badge

More hero blocks you might like

A centered hero section with headline, subheadline, and dual CTAs

A hero section with split layout for text and image