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

---
type: block
category: hero
title: Hero 2
description: A hero with social proof at the top — avatars, rating, and a trust line — followed by a clear message and full-width image.
---

```astro live props={{ name: 'hero-2' }}
---
import Hero2Block from "@/components/blocks/hero-2.astro"
import avatarSil from "@/assets/avatar-sil-veltman.webp"
import placeholderImage from "@/assets/placeholder.webp"
---

<Hero2Block
  title="Trusted by teams shipping with Astro every day"
  description="A hero with social proof at the top — avatars, rating, and a trust line — followed by a clear message and full-width image."
  socialProof={{
    avatars: [
      { image: avatarSil, initials: "AM", name: "Sil Veltman" },
      { image: avatarSil, initials: "KL", name: "Sil Veltman" },
      { image: avatarSil, initials: "SV", name: "Sil Veltman" },
    ],
    rating: 5,
    text: "4.9 from 2,400+ developers",
  }}
  buttons={[
    { label: "Get started", href: "/docs/", variant: "default" },
    { label: "View blocks", href: "/blocks/", variant: "secondary" },
  ]}
  image={{ src: placeholderImage, alt: "Product screenshot" }}
/>
```