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

---
type: block
category: "products"
title: "Products 1"
description: "Products 1 block example."
---

```astro live props={{ name: 'products-1' }}
---
import Products1Block from "@/components/blocks/products-1.astro"
import placeholderImage from "@/assets/placeholder.webp"
---

<Products1Block
  badge="Product grid"
  title="A simple product grid that works well after a features section"
  products={[
    {
      image: {
        src: placeholderImage,
        alt: "Landing page kit image placeholder",
      },
      title: "Landing page kit",
      description:
        "Tight cards are enough when the page already established the main product story.",
      price: { value: 100, currency: "USD", unit: "month" },
    },
    {
      image: {
        src: placeholderImage,
        alt: "Docs launch kit image placeholder",
      },
      title: "Docs launch kit",
      description:
        "Tight cards are enough when the page already established the main product story.",
      price: { value: 100, currency: "USD", unit: "month" },
    },
    {
      image: {
        src: placeholderImage,
        alt: "Section starter pack image placeholder",
      },
      title: "Section starter pack",
      description:
        "Tight cards are enough when the page already established the main product story.",
      price: { value: 100, currency: "USD", unit: "month" },
    },
    {
      image: {
        src: placeholderImage,
        alt: "Conversion toolkit image placeholder",
      },
      title: "Conversion toolkit",
      description:
        "Tight cards are enough when the page already established the main product story.",
      price: { value: 100, currency: "USD", unit: "month" },
    },
  ]}
/>
```