StoreHub Web Kit

On-brand landing pages, built from one shared kit.

A light-first Astro component library for StoreHub marketing pages. Every block reads from the brand tokens, so anything you assemble stays unmistakably StoreHub. Built to be scrolled by humans and crawled by AI.

Explore foundations Browse sections

Light theme first
Barlow + Open Sans
Accessible by default
Responsive 1440 / 1024 / 390

FoundationsColour, gradients, type scale, spacing, icons, logo, and primitive states - every value from the shared brand tokens.ComponentsOver 50 reusable molecules across forms, nav, overlays, data, media, cards, and state.SectionsOver 90 full-width section variants across 15 categories - heroes, features, pricing, social proof, CTAs, and more.ExamplesComplete landing pages assembled from the kit, showing how the blocks compose into real pages.

For AI agents

Point your agent here.

Open this kit's folder in Claude Code (or any coding agent) and paste the prompt below. It readsCLAUDE.md and /kit-manifest.json - every component and section (name, file, route, anchor, tags, props) - and builds on-brand pages from the library.

Paste into your coding agent

Read CLAUDE.md and kit-manifest.json in this StoreHub Web Kit repo, then help me build an on-brand StoreHub landing page by composing its sections and components.

Rules: light theme only, Barlow headings + Open Sans body, consume the var(--sh-*) brand tokens (never hardcode colours, sizes, or fonts), Lucide line icons, accessible and responsive at 1440 / 1024 / 390.

First list a few section options for each part of the page (hero, features, social proof, pricing, CTA, footer), then assemble the page once I pick.

Or browse directly:/kit-manifest.json /foundations /components /sections