---
type: block
title: Product
description: A focused product section for flagship offers and compact product storytelling.
---

> Fulldev UI for Astro. The `@fulldev` registry in `components.json` points at `https://ui.full.dev/r/styles/{style}/{name}.json`; see [installation](/astro/docs/installation.md).

```astro live props={{ name: 'product-1' }}
---
import Product1Block from "@/components/blocks/product-1.astro"
import placeholderImage from "@/assets/placeholder.svg"
---

<Product1Block
  badge="Featured product"
  title="One focused product section for a flagship offer"
  description="The product family only needs one strong section when the page should quickly explain the offer, its price, and the next action."
  image={{
    src: placeholderImage,
    alt: "",
  }}
  price={{
    value: 129,
    currency: "USD",
    unit: "month",
  }}
  note="Includes reusable launch sections, content layouts, and shared visual rules for docs and marketing pages."
  buttons={[
    { label: "Pricing", href: "/blocks/pricing/" },
    { label: "Reviews", href: "/blocks/reviews/" },
  ]}
/>
```

## Installation

```bash
npx shadcn@latest add @fulldev/product-1
```
