Navigation: [/sitemap.md](/sitemap.md)

---
type: block
category: hero
title: Hero 8
description: Minimal text with maximum image. A 1:3 split where the product screenshot dominates and the message stays compact.
---

```astro live props={{ name: 'hero-8' }}
---
import Hero8Block from "@/components/blocks/hero-8.astro"
import placeholderImage from "@/assets/placeholder.webp"
---

<Hero8Block
  title="Let the image do the talking"
  description="Minimal text with maximum image. A 1:3 split where the product screenshot dominates and the message stays compact."
  buttons={[
    { label: "Get started", href: "/docs/", variant: "default" },
    { label: "Learn more", href: "#", variant: "secondary" },
  ]}
  image={{ src: placeholderImage, alt: "App screenshot" }}
/>
```