Skip to content

Hero Section Blocks

9 blocks

Above-the-fold hero sections with headlines, CTAs, product shots, video and logo strips.

01/09Hero Section 1

Dark hero with an animated headline, announcement pill, dual CTAs, a product screenshot and a logo strip.

  • Introducing Support for AI Models
  • Modern Solutions for Customer Engagement
  • Highly customizable components for building modern websites and applications that look and feel the way you mean it.
  • Start Building
  • Request a demo
  • Meet Our Customers
  • app screen
  • Nvidia Logo
  • Stripe Logo
  • GitHub Logo
  • Nike Logo
  • Lemon Squeezy Logo
  • Laravel Logo
  • Supabase Logo
  • Anthropic Logo
  • easeOut

02/09Hero Section 2

Centered hero with animated text, a floating header and a light/dark product screenshot.

  • Build and ship faster with Lyra
  • Tailwindcss highly customizable components for building modern websites and applications that look and feel the way you mean it.
  • Start Building
  • Request a demo
  • Meet Our Customers
  • app screen
  • Nvidia Logo
  • Stripe Logo
  • GitHub Logo
  • Nike Logo
  • Lemon Squeezy Logo
  • Laravel Logo
  • Supabase Logo
  • Anthropic Logo
  • easeOut

03/09Hero Section 3

Minimal hero with an email capture form, animated copy and a customer logo cloud.

  • Healthier daily routine
  • Tailwindcss highly customizable components for building modern websites and applications that look and feel the way you mean it.
  • Get Started
  • Steps
  • This year, you're walking more on average than you did in 2023.
  • Your mail address
  • easeOut

04/09Hero Section 4

Split hero with a bold headline, abstract artwork and an infinite logo slider.

  • Ship faster with Lyra
  • Highly customizable components for building modern websites and applications that look and feel the way you mean it.
  • Start Building
  • Request a demo
  • Powering the best teams
  • Abstract Object
  • Nvidia Logo
  • Stripe Logo
  • GitHub Logo
  • Nike Logo
  • Lemon Squeezy Logo
  • Laravel Logo
  • Supabase Logo
  • Anthropic Logo

05/09Hero Section 5

Full-bleed video hero with a sticky header and an infinite logo slider.

  • Build faster with Lyra
  • Highly customizable components for building modern websites and applications you mean it.
  • Start Building
  • Request a demo
  • Powering the best teams
  • Nvidia Logo
  • Stripe Logo
  • GitHub Logo
  • Nike Logo
  • Lemon Squeezy Logo
  • Laravel Logo
  • Supabase Logo
  • Anthropic Logo

06/09Hero Section 6

Product hero with a newsletter input, announcement link and an app screenshot.

  • Login
  • New
  • Introducing Lyra 2.0
  • Production Ready Digital Marketing blocks
  • Responsive, accessible sections you can drop into any Next.js project and make your own.
  • Get Started
  • Faster
  • Modern
  • 100% Customizable
  • Your mail address
  • app illustration
  • Features
  • Solution
  • Pricing
  • About
  • Close Menu

07/09Hero Section 7

Carousel-driven hero built on Swiper, with a headline and CTA pair.

  • Login
  • New
  • Introducing Lyra 2.0
  • Tame the Wild West
  • of Frontend Development
  • Tailwindcss highly customizable components for building modern websites and applications that look and feel the way you mean it.
  • Highly customizable components for building modern websites and applications, with your personal spark.
  • Start Building
  • 30% Increase in revenue
  • 45% Increase in revenue
  • 60% Increase in revenue
  • Features
  • Solution
  • Pricing
  • About
  • Close Menu

08/09Hero Section 8

Centered hero with an announcement link, gradient backdrop and a large app screenshot.

  • Login
  • New
  • Introducing Lyra 2.0
  • Modern Software testing reimagined
  • Tailwindcss highly customizable components for building modern websites and applications that look and feel the way you mean it.
  • Highly customizable components for building modern websites and applications, with your personal spark.
  • Start Building
  • Your favorite companies are our partners.
  • app screen
  • Nvidia Logo
  • Stripe Logo
  • GitHub Logo
  • Nike Logo
  • Laravel Logo
  • Supabase Logo
  • Lemon Squeezy Logo

09/09Hero Section 9

Hero with a customer logo strip and a dashboard screenshot below the fold.

  • Login
  • Modern Software testing reimagined
  • Catch regressions before your users do with end-to-end tests that run on every commit.
  • Start Building
  • Your favorite companies are our partners.
  • Lyra app screenshot
  • Nvidia Logo
  • Stripe Logo
  • GitHub Logo
  • Nike Logo
  • Laravel Logo
  • Supabase Logo
  • Lemon Squeezy Logo
  • Anthropic Logo
  • Tailwind CSS Logo
  • Vercel Logo