Skip to main contentSkip to navigation

Hero Sections

Full-width hero sections for landing pages with headlines, CTAs, and imagery.

Overview

Hero blocks are viewport-sized sections designed for the top of landing pages. They feature bold typography, call-to-action buttons, and visual elements to capture user attention.

Variations

App UI Showcase

Component showcase-app-ui-01 not found in registry.

A hero section showcasing your app's UI with a centered layout and product screenshot.

E-commerce Showcase

Component showcase-ecommerce-01 not found in registry.

A hero section designed for e-commerce with product imagery and shopping CTAs.

Marketing Showcase

Component showcase-marketing-01 not found in registry.

A bold marketing hero section with large typography and conversion-focused design.

Features

  • Responsive Design: Adapts to all screen sizes
  • CTA Buttons: Primary and secondary call-to-action buttons
  • Visual Elements: Support for images, gradients, and animations
  • Typography: Large, bold headlines with supporting text
  • Customizable: Easy to modify colors, text, and layout