Pharmacy Storefrontv0.1.1
Use this Skill to build a storefront.
Build a pharmacy storefront with Claude Fable 5: one HTML file, 30-plus routes, a filtered shop, product pages, a bag that works, demo checkout and booking.
Picked most often by
Updated Oct 24, 2026
Preview gallery
Similar Skills
View all
What you get
- A single offline HTML file of 30-plus linked routes that reads fine with JavaScript off
- Home: hero frame, category tiles, a deals countdown, trending products in tabs, promo tiles, a feature banner, reviews, perks, FAQ and an app band
- A shop with a filter rail (a bottom sheet on phones), search, sorting, removable filter chips and an empty state
- Product pages showing a gallery, variants, unit price, stock, notes from the pharmacist and related items
- A bag with quantity steppers, undo after removing, promo codes and a delivery fee set by area
- A demo checkout that picks a time slot, validates inline and ends on an order timeline
- Prescription upload that echoes the file name, a tool for booking consultations, plus membership, brands, help and legal pages
- Open-source fonts and icons embedded, plus Pharmacy structured data
Good fit
- Independent pharmacies, chemists and health shops
- Owners after a fast store that is wholly theirs
- Agencies building local stores
Not for
- Live payments or stock syncing; checkout is only a demo
- Chains running many branches
- Systems that dispense prescriptions
About this Skill
A pharmacy wants customers to find a product, reach a pharmacist and order on its own site. Give your agent its real products, prices, delivery areas and staff, and you get one offline HTML file. A bright home page leads into a shop with filters and search; each product page has variants that change the price and stock line; the bag takes promo codes and can undo a removal; checkout offers real delivery slots yet stays a demo. Around the store: prescriptions, consultations, membership, brands, help, about, contact, account, app, delivery, legal pages and a designed 404. All of it is clickable, and the page says nothing is sent.
How it works
- Collect products and prices, delivery areas, pharmacists, offers and opening hours from the pharmacy
- Fill in site.json per the schema; anything unknown stays out
- Run the build, which names every problem in the brief together
- Validate: one file, a single h1 on each page, all links resolving, labeled controls, photos present
- Open each page at 1440, 1024, 768 and 390 px; take the bag and checkout end to end
- Hand over the file along with whatever the pharmacy still has to provide
Checked before delivery
- validate.mjs passes: single file, one h1 per page, every link resolves, labelled controls, structured data
- Every price, pack size, claim and hour matches the brief; no invented efficacy or dosage
- Bag, filters, variants, promo codes and the checkout demo work in a browser at 1440, 1024, 768 and 390 px
What you need before you start
- You bring
- Pharmacy name, tagline, address, phone, email and opening hours · Delivery areas with fees, times and free-delivery thresholds · Categories, brands and products with real prices, pack sizes and label facts · Pharmacists (name, role, focus, days) and services · Offers, FAQs and legal text
- Dependencies
- Node.js 20 or later · No packages to install, no API keys, no network access
- Outside costs
- None
- Last tested
- v0.1.1 — Claude Code / Codex / Cursor
User reviews
Loading reviews…
FAQ
Is the checkout connected to payments?
No. It is a demonstration: it checks the form, shows a confirmation and says outright that no money was taken. A live store needs your payment provider connected.
What if the pharmacy hasn't sent product photos?
Labeled placeholders hold their places, and the image plan spells out exactly which photos to produce.
Could it make up a price, a dose or a health claim?
No. When something is missing the build stops and lists it, and label facts come only from the pharmacy.
Does the same engine work for shops that aren't pharmacies?
It runs on a common store engine, and this template adds the pharmacy pages and wording. The same shop, bag and checkout appear in other storefront Skills.