Bosia Bosia v0.6.24

Heros — Product

Centered SaaS product-launch hero with email capture and a browser mock.

bun x bosia@latest add block heros/product

Centered SaaS product-launch hero with email capture and a browser mock. A self-contained, full-width <section> built from semantic tokens only, so it restyles across all 18 themes — the brand colour maps to --primary.

Preview

B
Brand
New · AI-assisted workflows

Ship work, not status updates.

The project tool your team won’t quietly abandon. Plans, docs, and progress that keep themselves up to date.

Free for 14 days · No card required

Powering teams at
VercelLinearNotionFigmaStripe
app.brand.com
Product

Install

bun x bosia@latest add block heros/product

Pulls the @lucide/svelte npm package for icons.

Usage

<script lang="ts">
	import Product from "$lib/blocks/heros/product/block.svelte";
</script>

<Product />

Drop it at the top of a route. Any interactive bits (size / color / age pickers, address or email inputs) are cosmetic local $state — wire them to your own data. Edit block.svelte to swap copy and the Unsplash images.

Source

src/lib/blocks/heros/product/block.svelte