Free pharmacy website template
Edit it by hand: it is one index.html with no build step, so you can open it in any text editor, change the words and photos, and upload it to any static host. Not a coder? Describe your business in one sentence to 8B's AI website builder and it designs a new site for you, with more pages when you need them. Designing is free; publishing with hosting is $9 a month, billed yearly. It also works inside Claude and ChatGPT.
MIT license · Made by 8B, an AI website builder · Plain text: hale.md, data: hale.json
About this pharmacy website template
Pharmacy website template: one free HTML file for an independent chemist, with weekly packs, a walk-in clinic, a vaccination table, a four-shelf shop, a bike delivery round and a repeat form. Each part is a pastel paper folder on a grey ground, filed under a header tab. AGENTS.md is included, so Claude Code, Cursor or Codex can adapt it.
At a glance, October 2026. One 84 KB index.html with its CSS and JavaScript inside, 11 sections, 20 Unsplash photos credited in CREDITS.md, Gabarito and Geist from Google Fonts, GSAP 3.13.0 (ScrollTrigger); Lenis 1.3.27 smooth scroll loaded from jsDelivr.
People who search for a pharmacy template or pharmacy web design usually run a counter that does more than dispense. This page covers weekly packs for people on four or more medicines, a walk-in clinic with four conditions, a vaccination table, a small shop, a delivery round and a repeat form. A travel health service, optician or dental practice can drop whatever it does not sell.
Give the agent the facts only the pharmacy has: name, address, hours, which conditions the clinic treats, who qualifies for each jab, delivery days and area, and the team. The demo invents all of them, NHS Pharmacy First wording included. Replace the pharmacy name, and set the footer wordmark's --len to match it. Vibe coding this in Claude Code is quick if the agent leaves the counts the animations are written for: four conditions with four photos, three people, and each shelf button tied to its panel by aria-controls.
If you are comparing templates for pharmacy sites, this is the right base when one counter offers several services and you want each filed as its own part of a single page. A business that sells timed classes, like a class studio, needs a different page shape. The weak spot is health data: the form sends nothing and asks for a date of birth. A no-code route exists too: 8B's builder designs a site from a sentence.
Good for:
Turn the pharmacy website template into your site with an AI agent
With an AI coding agent
Files (PowerShell: curl.exe):
curl -LO https://raw.githubusercontent.com/8bsite/pharmacy-website-template/main/index.html
curl -LO https://raw.githubusercontent.com/8bsite/pharmacy-website-template/main/AGENTS.md
curl -LO https://raw.githubusercontent.com/8bsite/pharmacy-website-template/main/LICENSE
curl -LO https://raw.githubusercontent.com/8bsite/pharmacy-website-template/main/CREDITS.mdPrompt for the agent:
Read AGENTS.md, then edit index.html. Make this the site for <my pharmacy: name, town, address, services (repeats, packs, clinic, jabs, shop, delivery), hours, delivery days and stops, team, how people order a repeat>. Replace first the name, Leeds address, hours, delivery stops, people, and the clinic and jab rules. Keep the section ids, the data-tab and data-step numbers and the three portraits; set the footer wordmark's --len to the new name's length. Ask me for missing facts; never invent prices, eligibility rules, hours, registration numbers or contacts.In a terminal
npx degit 8bsite/pharmacy-website-template my-sitePharmacy website design and motion
Palette
#c9c9c7 grey page ground and header bar, empty photo frames, the Visit tab of the questions#ffffff white sheets, the first header tab, question cards, text on the dark folders#131313 text, black bars and rules, table lines, the seal bar and the route fill#d4e3f3 pale blue: weekly packs folder, bedtime row, form fields, default button fill, Repeats tab#f6d4dc pink: clinic and vaccination folders, midday row, Clinic tab#d1e8d9 green: shop and delivery folders, evening row, the thank-you line, Shop tab#fbefc4 yellow: people and story folders, morning row, the form button, People tab#575757 dark grey: questions and contact folders, the Visit tab in the headerFonts
- Gabarito: headings, the big Walk in line, numbers in the pack grid and condition names at weight 500, links, and the wordmark at weight 400
- Geist: body text, captions, table labels, small uppercase labels and form fields at weights 400 to 600
Every part is a pastel paper folder; the clinic, shop, people and questions folders carry a slanted tab on top, set at their position in the six-tab strip of the fixed header. Sheets carry heavy black bars top and bottom, photos have a notched top edge, and tables use thick ruled lines. Clinic, people, story and contact split into two columns. The name sits in wide-spaced capitals in the header and as the huge footer line.
Pharmacy website design here is flat pastel blocks, pale blue, pink, green and yellow, cut with black bars. A thick rule draws along sheets as they enter, photos open from a small tab to the full frame, and buttons fill from below on hover.
Every value of this pharmacy website design, with the type scale, spacing and the motion rules, is in its DESIGN.md file (Google's format), ready for a coding agent or Stitch.
What is on the pharmacy website page
- NavigationFixed header: HALE wordmark with a caption, two quick links and a strip of six coloured file tabs that marks where you are
The tab of the section in view is raised as you scroll, and any tab rises on hover; both are CSS transitions that keep running with reduced motion.
- Sealed by the week, sorted by the hourFirst screen: headline about weekly packs, a paragraph, a button, a link, a photo of pill boxes and an example week grid
On load the intro lifts into place, the bars draw and the week grid fades in, then a black seal bar runs down the grid once and each row of pockets fills as it passes.
- Seen today in the room behind the counter, with no appointmentFolder with four photos that wipe over each other beside a column of four conditions, with a marker that steps down the list
Scrubbed with the scroll, a white marker steps down the four conditions and the matching photo wipes down over the one before.
- Jabs by the season, given in the same roomSheet with a photo and a table of four vaccines: who, when and a Book link
A thick bar draws along the sheet and the photo opens from its tab as they come into view.
- The shop: four shelves chosen by our pharmacistsFour shelf rows, one open at a time, each with a photo, a list of three things and a link
As the section comes up the four rows deal down from a stacked pad, and pressing a row opens its panel and closes the others.
- Delivered by bike, Tuesdays and FridaysDelivery round: heading and paragraph, a route bar and five stops that slide sideways under the header
The stage is held under the header while the five stops slide sideways and the route bar fills, scrubbed with the scroll.
- The people at the counterThree portraits as slats that widen in turn beside three name cards (owner, clinic lead, counter)
The three portrait slats widen in turn while the other two narrow, and the card beside each is ruled off with a bar.
- Independent since 1987, and still nobody's branchThe story of the shop as a letter with a photo of the shop dog
The photo opens from its tab and a bar draws along the letter.
- Asked at the counterSeven questions as native details elements, each with a coloured tab naming its part of the pharmacy
The decorative tabs slide from the left edge of their rows into place while the list scrolls in.
- 1 Example Street, Leeds LS0 0AAAddress, hours, phone, email and a shop-door photo beside the repeat order form
The photo opens from its tab and a bar draws along the repeat form.
- FooterFooter with a large HALE wordmark, shop name and address, phone, five links, email and a legal line
Before you publish the pharmacy website site
- Replace social preview image, favicon, phone number, email address and contact form (sends nothing yet) and the invented demo facts (prices, dates, addresses). AGENTS.md lists them.
- Find us link in the header lead to
#contactnow; point them to keep, or a map link. - Order a repeat link in the header, the Order a repeat button and the Ask about weekly packs link in the first part, and the four Book links in the vaccination table lead to
#order (the repeat form in the contact section)now; point them to your online repeat-prescription or booking page, or keep #order once the form is connected. - The tab strip in the header (Hale, Repeats, Clinic, Shop, People, Visit) lead to
#packs, #packs, #clinic, #shop, #people and #contact (the first two tabs both go to #packs)now; point them to keep as anchors. - Ask us to order something links under each of the four shop shelves lead to
#contactnow; point them to your shop enquiry page or email. - Send to the counter button of the repeat form lead to
the form has action="#order" and method="post"; section-script:contact checks the fields, shows the thank-you line and clears the form, nothing is sentnow; point them to your form handler or prescription system, over HTTPS, with a privacy notice (the form asks for name, date of birth, phone and medicines). - The repeat form asks for a name, a date of birth, a phone number and medicines, but sends nothing: the script only checks it and shows the thank-you line. Connect it to a secure endpoint and add a privacy notice before launch, because the data is health related.
- On phones (760 px and below) the header tab labels shrink to 10.5 px to fit six tabs in one row, and the Find us link is hidden.
- The bike delivery stage is held under the header for the full height of the screen minus the header, and has a minimum height of 520 px, so on windows shorter than about 630 px the held stage is taller than the screen.
- Photos are lazy-loaded from Unsplash, including the one on the first screen; self-host them before launch.
Questions about this pharmacy website template
Is this one of the free pharmacy website templates, and can I use it for a client?
Yes. It is one index.html under the MIT license, so a freelancer can build a pharmacy site for a client at no cost. GSAP, ScrollTrigger and Lenis load from jsDelivr, there is no build step, and the photos are Unsplash images. CREDITS.md lists photos and fonts.
Does the repeat form send anything?
No. The script checks the fields, shows a thank-you line and clears the form; nothing leaves the page. Connect Formspree, Netlify Forms or your own secure endpoint and add a privacy notice, because the form asks for name, date of birth, phone and medicines, which is health data.
How do I give this template to an AI agent?
Download index.html and AGENTS.md from the repository, put both in the project folder and ask Claude Code, Cursor or Codex to read AGENTS.md first. The prompt on this page works as the opening message. Edit the file itself, not a fetched page, which an agent receives as a summary.
What must I keep when I rewrite the pharmacy copy?
Keep the section ids and the data-8b-section, data-8b-motion and data-8b-part attributes, the six header tabs in order with the data-tab numbers on the sections, the data-step numbers that pair each clinic photo with its condition, and the footer wordmark's --len. The people animation is written for three portraits and three cards.
How to create a pharmacy website like this without editing code?
Use 8B's AI website builder. You describe the site in a sentence and it designs a new one, not this template. Designing and restyling are free; publishing with hosting and SSL, full HTML export and AI edits in chat are on Pro at $9 a month billed yearly. It also runs inside Claude and ChatGPT.
Can a US or Canadian pharmacy use it?
Yes, after a text pass. The layout suits any counter-based practice, but the demo is British: pounds, NHS Pharmacy First, a Leeds address and a 0113 phone number. Replace those, and the eligibility lines for the flu and Covid jabs, with your own region's rules.



