
Ember E-Bike Storev1.0.2
Use this Skill to build ecommerce storefront.
Build a premium electric-bike store with an orange photographic hero, bold condensed headings, dark photographic category cards and a dark component explorer that swaps close-up photos. Stone product cards come from one coherent studio set, and the whole store works: variants that change the price, a mini-cart, bag, demo checkout, compare, a range calculator and test-ride booking. By default it arrives as one self-contained file that opens offline in any browser.
Picked most often by
Updated Oct 3, 2026
Preview gallery
Runs in
Generates with
Similar Skills
View all skillsWhat you get
- A 35-route example for the fictional Askel Cycles: six bikes, four categories, equipment, compare, journal, test rides, about, contact, FAQ, delivery, legal, bag, checkout and a 404.
- A working store flow: battery and frame-size variants, a mini-cart drawer, a bag with promo code, demo checkout with validation and an order confirmation that never takes payment.
- Home tools (hero carousel, component explorer, range calculator, shop finder) plus a style guide, image plan, photo-matching script and built-in checks.
Good fit
- E-bike, scooter, cargo-trike or moped brands that want a premium store front with real product detail.
- Brands with partner shops or showrooms that offer test rides and want booking and a shop finder.
- Teams that want working variant, bag, compare and checkout screens to review before wiring payments.
Not for
- Taking real orders: checkout says clearly that payment is off, and nothing is charged until you connect your own commerce backend.
- Large catalogues that need inventory sync or a content management system.
- Soft pastel or minimal brands; the look relies on saturated orange, condensed capitals and dark panels.
About this Skill

Bring your bike range and the Skill builds a full store front: an orange studio hero, bold condensed headings, dark category cards and stone product cards from one coherent photo set, with a store flow that actually works. The worked example is the fictional Askel Cycles, with 35 connected routes. The default result is one self-contained file that opens offline in any browser.

What you get
- Home with hero carousel, category cards, line-up, component explorer, range calculator, reviews, test-ride finder, journal and FAQ
- Product pages with gallery, battery and size variants, a fit helper based on height, specs and related items
- Bag, demo checkout with delivery options and an order confirmation, plus compare, equipment, delivery, legal and contact pages
- Anton, Archivo and Geist Mono embedded in the file, so nothing loads from the network

How to use it
- Share your models, prices, specs, categories, market settings (currency, tax, postcodes) and any partner shops.
- Your agent fills the catalogue, generates a matching photo set and checks every route and link.
- Click through variant, bag, checkout and test-ride booking on desktop and phone, then ask for changes.

Generating new product photos may incur your image tool's usage charges. Checkout and booking show honest demo confirmations and send nothing until real services are connected.
What you need before you start
- You bring
- Brand name, a tagline of four words or fewer and your market (currency, tax, postcodes) · Models with prices, specs, variants and categories, plus accessories if you sell them · Partner shops or showrooms, contact details and any product photos you own
- Dependencies
- Node.js 18 or newer on your agent's machine, to run the bundled script that builds the single offline file · Internet access while the file is built, so the fonts can be downloaded once and embedded · Python with NumPy and Pillow, for the script that crops and matches product photos · An image generation tool in your agent for new bike and lifestyle photos
- Outside costs
- Generating the bike and lifestyle photos with your agent's image tool may incur that tool's usage charges. The image plan includes a minimum set for small budgets, and some equipment and close-up images can be reused.
- Last tested
- v1.0.2 — Claude Code / Claude Desktop / Cowork / Codex / ChatGPT
User reviews
Loading reviews…









