Heros — New Drop

Fashion new-drop product hero with a size selector and price.

bun x bosia@latest add block heros/new-drop

Fashion new-drop product hero with a size selector and price. 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

Brand

The new drop · 24 pieces

The overcoat, reimagined in camel wool.

Double-faced Italian wool, raglan shoulder, horn buttons. Made in limited numbers — once it’s gone, it’s gone.

$480 4.9 86 reviews

Select size

Just dropped

Install

bun x bosia@latest add block heros/new-drop

Pulls the @lucide/svelte npm package for icons.

Usage

<script lang="ts">
	import NewDrop from "$lib/blocks/heros/new-drop/block.svelte";
</script>

<NewDrop />

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/new-drop/block.svelte