Veterinary Website Template

About this veterinary website template

The 21 pages you get

Home /

Full-width photo of a dog giving its paw, with the headline, book and check-symptoms buttons and a rating line on a white panel, then promises, six service cards with from-prices, the symptom checker, the practice band, the first visit, the health planner, health plan vs pay as you go, owner quotes beside pet photos, guides, FAQ tabs and a register band.

Services /services/

All six services with from-prices, plus the lab, imaging, cat-only waiting room and ward.

Service pages /services/…/

Consultations, vaccinations, neutering, dental care, 24/7 emergency care, and rabbits & small pets: price, time, which pets, what’s included, the matching fee list, two photos and a book button that pre-selects the service.

Prices /prices/

Every fee in plain lists: consultations, vaccinations, neutering, dental and out of hours, then the health plan price per species and the plan vs pay-as-you-go table.

Is it urgent? /emergency/

The 24/7 number, the symptom checker, the cases that should never wait, out-of-hours fees and how to arrive at night.

Health planner /health-planner/

The timeline on its own page, opening on a kitten, with what puppies, adults and small pets need.

About us /about/

Why the practice stayed independent, the team as text cards with their own pets, the lab and cat-only side, owner quotes and a line for your accreditation.

Pet care guides /journal/

A card list with a Dogs, Cats or Rabbits & small pets chip on each. Add a Markdown file and it appears here and in the sitemap.

Guides /journal/…/

Three written guides: what to do when a dog eats chocolate, a new kitten’s first eight weeks, and why rabbit teeth need checking every six months.

Questions /faq/

Twelve questions in keyboard-friendly tabs (Dogs, Cats, Rabbits & small pets) plus registering, insurance, paying and parking.

Book an appointment /contact/

Booking request with what you need, pet, what you’re seeing, best time and your details, filled in from any book button, the symptom checker or the planner. Emergencies are sent to the phone instead.

Privacy and terms /legal/…/

Two starter legal pages on a shared layout, covering records, reminders, estimates, insurance and out-of-hours care.

404 /404

Designed, with the 24/7 number and a way to the symptom checker.

What is in the build

• A symptom checker: dog, cat or rabbit and small pet, eleven common symptoms and up to two yes/no follow-ups give Urgent, See us today or Book a routine visit, with why, what to do, what to do meanwhile and a booking link that carries the pet and symptom to the form
• Urgent results put the 24/7 number first, and every result says it is guidance, not a diagnosis
• A health planner: species and age give a twelve-month timeline drawn in code, with vaccinations, boosters, neutering, dental and senior checks marked on it, monthly flea and worm treatment as a stripe, and a book button for the next item
• Symptom rules in src/data/triage.ts, schedules in src/data/timeline.ts and every fee and health plan price in src/data/prices.ts, with the checker and planner maths in tested files
• A health plan vs pay-as-you-go table that stacks row by row on phones instead of scrolling sideways
• Services and guides as content collections, and every practice fact, opening hour and out-of-hours time in one file
• Real consulting-room photography of animals and gloved hands, no faces and no brands; one accent colour and two fonts rebrand the whole site; Vitest and Playwright suites included

The design decision

Every template in this catalog is loud in exactly one channel and deliberately quiet in the other three. That single rule is what stops 71 different worlds reading as one design system in different paint.

The world

White ground with pale oat blocks and one dark ink-teal band, Fredoka over Kumbh Sans, real photography of gloved hands examining dogs, cats, rabbits and guinea pigs, and one collar-coral accent used as a fill.

The mechanic

Pick dog, cat or rabbit, one of eleven symptoms and up to two follow-ups to get urgent, same-day or routine with next steps, the 24/7 number first when urgent and a pre-filled booking link; a planner turns species and age into a twelve-month timeline of vaccinations, neutering, dental and senior checks. Motion is one quiet reveal.

Loud channel

Imagery

Imagery. Gloved hands examining dogs, cats, rabbits and guinea pigs, kittens, recovery and consulting rooms

Type & palette

Fredoka · Kumbh Sans

#ffffff #1c2629 #f26b4f

Who it is for

Built for independent small-animal vets and pet clinics that see dogs, cats, rabbits and small pets and want owners to know when to call, what things cost and what is due next. It suits a practice with its own emergency line or one that shares a night service, and it works for any currency, price list or vaccine schedule by editing the data files.

Under the hood

• Astro 7 · static output, zero client framework
• Tailwind 4 · one @theme block holds the palette
• MDX content collections for the blog
• GSAP + Lenis for the scroll work, reduced-motion aware
• Self-hosted woff2 — no Google Fonts request
• Sitemap, canonicals and per-route meta wired
• Vitest + Playwright suites in the repository
• Zero third-party requests · strict CSP-ready

How to get started

1. 01 Accept the repository invite and clone it.
2. 02 Run npm install, then npm run dev.
3. 03 Replace the content in src/data/ with your own — that is where the brand, the copy and every list live.
4. 04 Swap the images in public/images/ and the palette in the @theme block.
5. 05 Run npm run build and deploy dist/ anywhere static.

Questions